<template>
  <div class="page openShroffAccount new-form-list">
      <mt-actionsheet :actions="actions"
  		                v-model="chooseImgVisible">
  		</mt-actionsheet>
      <hlwsk v-if="hlwskProtocol" @cancel="(flag)=>{this.hlwskProtocol = flag}"/>
      <ydzfsd v-if="ydzfsdProtocol" @cancel="(flag)=>{this.ydzfsdProtocol = flag}"/>
      <div v-show="!hlwskProtocol && !ydzfsdProtocol"  class="scroll-view">
        <customHeader v-if="addStore == 'true'" middleTitle="开通收款账户"   rightTitle="" @leftCallBack="handleBack"  />
        <div v-if="addStore == 'false'">
          <customHeader v-if="firstStep" middleTitle="开通收款账户"   rightTitle="" @leftCallBack="handleBack"  />
          <customHeader v-if="!firstStep" middleTitle="开通收款账户"   rightTitle="" @leftCallBack="previous"  />
        </div>
        <div class="page-body">
          <div class="form-wrapper" v-show="firstStep">
            <div class="border-bt-all">
              <div class="form-title ">
                商户信息
              </div>
            </div>
            <div class="form-item border-bt-left">
              <div class="label">商户类型</div>
              <div class="pick-value" @click="showPicker('merchantType')">{{this.formData.merchantType?showIdName(merchantType.data,this.formData.merchantType):merchantType.tip}}
              </div>
              <i class="zhk-list_rarrow"></i>
              <awesome-picker ref="merchantType" :textTitle="merchantType.textTitle" :data="getAwesomeData(merchantType.data)" :anchor="merchantType.anchor" @confirm="(v)=>handleConfirm('merchantType',v,merchantType.data)">
              </awesome-picker>
            </div>
              <div v-if="formData.merchantType != '01'"  class="store-head ">
                <div class="tt">营业执照照片</div>
                <div  class="ct border-bt">
                    <div  class="store-head-box border-dashed" v-if="!formData.yzLicensePhoto" @click="chooseImg('yzLicensePhoto','baidu_ocr_business_license')">
                      <img class="imgOpcity" :src="require('../../assets/images/up_bg_yy.png')" />
                      <span class="zhk-sczp"/>
                    </div>
                    <div class="store-head-box border-solid" v-else-if="formData.yzLicensePhoto.length" >
                      <img :src="repeatImgUrl(formData.yzLicensePhoto,'resize')" alt="" @click="showImg(formData.yzLicensePhoto)" />
                      <span class="zhk-sbylx" @click="delImage('yzLicensePhoto')"></span>
                    </div>
                </div>
              </div>
            <mt-field label="公司全称" placeholder="必须与营业执照登记名称一致" v-model="formData.merchantCompany" :attr="{ maxlength: 64}"></mt-field>
            <div class="cell-explain border-bt">
              <div class="ct">若营业执照名称为空或商户类型为自然人，填写：个体户+负责人名，例：“个体户李雷”</div>
            </div>
            <div v-if="formData.merchantType != '01'">
              <mt-field class="border-bt-left" label="营业执照注册地址" placeholder="请填写营业执照工商注册地址" v-model="formData.yzLicenseRegisterAddress" :attr="{ maxlength: 50}"></mt-field>
              <mt-field class="border-bt-left" label="营业执照注册号" placeholder="请填写营业执照工商注册号" v-model="formData.bussAuthNum" :attr="{ maxlength: 20}"></mt-field>
              <div class="form-item border-bt-left">
                <div class="label">营业执照有效期</div>
                <div class="pick-value" @click="showPeriod('licenseExpireStart')">{{this.formData.licenseExpireStart && this.formData.licenseExpire?moment(this.formData.licenseExpireStart).format('YYYY-MM-DD') + ' 至 ' + (this.formData.licenseExpire == '29991231'?'长期':this.formData.licenseExpire + '年'):licenseExpireStart.tip}}
                </div>
                <i class="zhk-list_rarrow"></i>
                <awesome-picker ref="licenseExpireStart" type="date" :textTitle="licenseExpireStart.textTitle"  :anchor="licenseExpireStart.anchor"  @confirm="(v)=>showPeriod('licenseExpire','licenseExpireStart',v)">
                </awesome-picker>
                <awesome-picker ref="licenseExpire"  :textTitle="licenseExpire.textTitle" :data="licenseExpire.data"  :anchor="licenseExpire.anchor" @cancel="()=>periodCancel('licenseExpireStart')" @confirm="(v)=>periodConfirm('licenseExpire',v,licenseExpire.data,'licenseExpireStart')">
                </awesome-picker>
              </div>
              <div class="form-item border-bt-left">
                <div class="label">是否三证合一</div>
                <div class="pick-value" @click="showPicker('licenseType')">{{this.formData.licenseType?showIdName(licenseType.data,this.formData.licenseType):licenseType.tip}}
                </div>
                <i class="zhk-list_rarrow"></i>
                <awesome-picker ref="licenseType" :textTitle="licenseType.textTitle" :data="getAwesomeData(licenseType.data)" :anchor="licenseType.anchor" @confirm="(v)=>handleConfirm('licenseType',v,licenseType.data)">
                </awesome-picker>
              </div>
            </div>
            <div  class="store-head ">
              <div class="tt">{{principalNameLb()+'身份证照片（正面）'}}</div>
              <div  class="ct border-bt">
                  <div  class="store-head-box border-dashed" v-if="!formData.yzCertPhotoa" @click="chooseImg('yzCertPhotoa','baidu_ocr_idcard_front')">
                    <img class="imgOpcity" :src="require('../../assets/images/up_bg_sa.png')" />
                    <span class="zhk-sczp"/>
                  </div>
                  <div class="store-head-box border-solid" v-else-if="formData.yzCertPhotoa" >
                    <img :src="repeatImgUrl(formData.yzCertPhotoa,'resize')" alt="" @click="showImg(formData.yzCertPhotoa)" />
                    <span class="zhk-sbylx" @click="delImage('yzCertPhotoa')"></span>
                  </div>
              </div>
            </div>
            <div  class="store-head ">
              <div class="tt">{{principalNameLb()+'身份证照片（背面）'}}</div>
              <div  class="ct border-bt">
                  <div  class="store-head-box border-dashed" v-if="!formData.yzCertPhotob" @click="chooseImg('yzCertPhotob','baidu_ocr_idcard_back')">
                    <img class="imgOpcity" :src="require('../../assets/images/up_bg_sb.png')" />
                    <span class="zhk-sczp"/>
                  </div>
                  <div class="store-head-box border-solid" v-else-if="formData.yzCertPhotob.length" >
                    <img :src="repeatImgUrl(formData.yzCertPhotob,'resize')" alt="" @click="showImg(formData.yzCertPhotob)" />
                    <span class="zhk-sbylx" @click="delImage('yzCertPhotob')"></span>
                  </div>
              </div>
            </div>
            <mt-field class="border-bt-left" :label="principalNameLb()+'姓名'" :placeholder="'请填写'+principalNameLb()+'姓名'" v-model="formData.principalPerson" :attr="{ maxlength: 10}"></mt-field>
            <mt-field class="border-bt-left" label="身份证号码" placeholder="请填写负责人身份证号码" v-model="formData.principalCertno" :attr="{ maxlength: 18}"></mt-field>
            <div class="form-item border-bt-left">
              <div class="label">身份证有效期</div>
              <div class="pick-value" @click="showPeriod('legalIdnumExpireStart')">{{this.formData.legalIdnumExpireStart && this.formData.legalIdnumExpire?moment(this.formData.legalIdnumExpireStart).format('YYYY-MM-DD') + ' 至 ' + (this.formData.legalIdnumExpire == '29991231'?'长期':this.formData.legalIdnumExpire+'年') :legalIdnumExpireStart.tip}}
              </div>
              <i class="zhk-list_rarrow"></i>
              <awesome-picker ref="legalIdnumExpireStart" type="date" :textTitle="legalIdnumExpireStart.textTitle"  :anchor="legalIdnumExpireStart.anchor"  @confirm="(v)=>showPeriod('legalIdnumExpire','legalIdnumExpireStart',v)">
              </awesome-picker>
              <awesome-picker ref="legalIdnumExpire"  :textTitle="legalIdnumExpire.textTitle" :data="legalIdnumExpire.data"  :anchor="legalIdnumExpire.anchor" @cancel="()=>periodCancel('legalIdnumExpireStart')" @confirm="(v)=>periodConfirm('legalIdnumExpire',v,legalIdnumExpire.data,'legalIdnumExpireStart')">
              </awesome-picker>
            </div>
            <mt-field class="border-bt-left" label="客服电话" type="tel" placeholder="请填写客服电话" v-model="formData.servicePhoneNo" :attr="{ maxlength: 11}"></mt-field>
            <div class="form-item border-bt-left">
              <div class="label">门店区域</div>
              <div class="pick-value" @click="showPicker('storeArea')">{{storeAreaName?storeAreaName:storeArea.tip}}</div>
              <i class="zhk-list_rarrow"></i>
              <awesome-picker ref="storeArea" :textTitle="storeArea.textTitle" :data="storeArea.data" :anchor="storeArea.anchor" @confirm="(v)=>handleConfirm('storeArea',v,storeArea.data)"></awesome-picker>
            </div>
            <mt-field class="border-bt-left" label="门店地址"  placeholder="请填写门店经营地址" v-model="formData.address" :attr="{ maxlength:32}"></mt-field>
            <div  class="store-head ">
              <div class="tt">门头照</div>
              <div  class="ct border-bt">
                  <div  class="store-head-box border-dashed" v-if="!formData.yzShopPhoto" @click="chooseImg('yzShopPhoto')">
                    <img class="imgOpcity" :src="require('../../assets/images/up_bg_md.png')" />
                    <span class="zhk-sczp"/>
                  </div>
                  <div class="store-head-box border-solid" v-else-if="formData.yzShopPhoto" >
                    <img :src="repeatImgUrl(formData.yzShopPhoto,'resize')" alt="" @click="showImg(formData.yzShopPhoto)" />
                    <span class="zhk-sbylx" @click="delImage('yzShopPhoto')"></span>
                  </div>
              </div>
            </div>
            <div  class="store-head ">
              <div class="tt">内景照</div>
              <div  class="ct border-bt">
                  <div  class="store-head-box border-dashed" v-if="!formData.yzIndoorPic" @click="chooseImg('yzIndoorPic')">
                    <img class="imgOpcity" :src="require('../../assets/images/up_bg_mn.png')" />
                    <span class="zhk-sczp"/>
                  </div>
                  <div class="store-head-box border-solid" v-else-if="formData.yzIndoorPic" >
                    <img :src="repeatImgUrl(formData.yzIndoorPic,'resize')" alt="" @click="showImg(formData.yzIndoorPic)" />
                    <span class="zhk-sbylx" @click="delImage('yzIndoorPic')"></span>
                  </div>
              </div>
            </div>
            <div  class="store-head border-bt">
              <div class="tt">收银台照</div>
              <div  class="ct ">
                  <div  class="store-head-box border-dashed" v-if="!formData.yzCheckstandPic" @click="chooseImg('yzCheckstandPic')">
                    <img class="imgOpcity" :src="require('../../assets/images/up_bg_sy.png')" />
                    <span class="zhk-sczp"/>
                  </div>
                  <div class="store-head-box border-solid" v-else-if="formData.yzCheckstandPic" >
                    <img :src="repeatImgUrl(formData.yzCheckstandPic,'resize')" alt="" @click="showImg(formData.yzCheckstandPic)" />
                    <span class="zhk-sbylx" @click="delImage('yzCheckstandPic')"></span>
                  </div>
              </div>
            </div>
            <div class="btn-box">
              <mt-button class="btn" type="primary" @click="next">下一步</mt-button>
            </div>
          </div>
          <div class="form-wrapper" v-if="!firstStep">
            <div class="border-bt-all">
              <div class="form-title ">
                基础信息
              </div>
            </div>
            <mt-field class="border-bt-left" label="商户名称" placeholder="请填写商户名称" v-model="formData.merchantName" :attr="{ maxlength: 30}">
              <mt-button class="btn-left" plain type="primary" size="small" @click="checkRepeat">验重</mt-button>
            </mt-field>
            <div class="form-item border-bt">
              <div class="label">经营类目</div>
              <div class="pick-value" @click="showPicker('mcc')">{{mccSpliceName?mccSpliceName:mcc.tip}}
              </div>
              <i class="zhk-list_rarrow"></i>
              <awesome-picker ref="mcc" :textTitle="mcc.textTitle" :data="mcc.data" :anchor="mcc.anchor" @confirm="(v)=>handleConfirm('mcc',v,mcc.data)">
              </awesome-picker>
            </div>
            <mt-field class="border-bt-left" label="门店简称" placeholder="支付时展示，需与门头上店名相关" v-model="formData.alias" :attr="{ maxlength: 20}"></mt-field>
            <div v-if="addStore == 'true'" class="form-item border-bt-left">
              <div class="label">门店区域</div>
              <div class="pick-value" @click="showPicker('storeArea')">{{storeAreaName?storeAreaName:storeArea.tip}}</div>
              <i class="zhk-list_rarrow"></i>
              <awesome-picker ref="storeArea" :textTitle="storeArea.textTitle" :data="storeArea.data" :anchor="storeArea.anchor" @confirm="(v)=>handleConfirm('storeArea',v,storeArea.data)"></awesome-picker>
            </div>
            <mt-field class="border-bt-left" :label="principalNameLb()+'手机号'" :placeholder="'请填写' + principalNameLb() +'手机号'" v-model="formData.principalMobile" :attr="{ maxlength: 11}"></mt-field>
            <mt-field class="border-bt-left" label="邮箱" placeholder="请填写负责人邮箱" v-model="formData.email" :attr="{ maxlength: 64}"></mt-field>
            <div v-if="formData.merchantType == '01'"  class="store-head">
              <div class="tt">手持身份证照片</div>
              <div  class="ct border-bt">
                  <div  class="store-head-box border-dashed" v-if="!formData.yzImgIdcardHolding" @click="chooseImg('yzImgIdcardHolding')">
                    <span class="zhk-sczp"/>
                  </div>
                  <div class="store-head-box border-solid" v-else-if="formData.yzImgIdcardHolding" >
                    <img :src="repeatImgUrl(formData.yzImgIdcardHolding,'resize')" alt="" @click="showImg(formData.yzImgIdcardHolding)" />
                    <span class="zhk-sbylx" @click="delImage('yzImgIdcardHolding')"></span>
                  </div>
              </div>
            </div>
            <div v-show="formData.merchantType != '01'"  class="store-head ">
              <div class="tt">连锁关系证明</div>
              <div class="store-head-explain">同一营业执照多次开通收款账户时必传</div>
              <div  class="ct border-bt">
                  <div  class="store-head-box border-dashed" v-if="!formData.yzImgStandardProtocol" @click="chooseImg('yzImgStandardProtocol')">
                    <span class="zhk-sczp"/>
                  </div>
                  <div class="store-head-box border-solid" v-else-if="formData.yzImgStandardProtocol" >
                    <img :src="repeatImgUrl(formData.yzImgStandardProtocol,'resize')" alt="" @click="showImg(formData.yzImgStandardProtocol)" />
                    <span class="zhk-sbylx" @click="delImage('yzImgStandardProtocol')"></span>
                  </div>
              </div>
            </div>
            <div v-if="formData.licenseType == '0'&&formData.merchantType !='01'">
              <div  class="store-head ">
                <div class="tt">组织机构代码证照片</div>
                <div  class="ct border-bt">
                    <div  class="store-head-box border-dashed" v-if="!formData.yzPrgPhoto" @click="chooseImg('yzPrgPhoto')">
                      <span class="zhk-sczp"/>
                    </div>
                    <div class="store-head-box border-solid" v-else-if="formData.yzPrgPhoto.length" >
                      <img :src="repeatImgUrl(formData.yzPrgPhoto,'resize')" alt="" @click="showImg(formData.yzPrgPhoto)" />
                      <span class="zhk-sbylx" @click="delImage('yzPrgPhoto')"></span>
                    </div>
                </div>
              </div>
              <div  class="store-head ">
                <div class="tt">税务登记证照片</div>
                <div  class="ct border-bt">
                    <div  class="store-head-box border-dashed" v-if="!formData.yzImgTaxReg" @click="chooseImg('yzImgTaxReg')">
                      <span class="zhk-sczp"/>
                    </div>
                    <div class="store-head-box border-solid" v-else-if="formData.yzImgTaxReg" >
                      <img :src="repeatImgUrl(formData.yzImgTaxReg,'resize')" alt="" @click="showImg(formData.yzImgTaxReg)" />
                      <span class="zhk-sbylx" @click="delImage('yzImgTaxReg')"></span>
                    </div>
                </div>
              </div>
            </div>
            <div v-if="formData.merchantType != '01'">
              <div v-if="formData.licenseType == '0'" class="form-item border-bt-left">
                <div class="label">账户类型</div>
                <div class="pick-value" >对公账户</div>
              </div>
              <div v-else>
                <div  class="form-item border-bt-left">
                  <div class="label">账户类型</div>
                  <div v-if="addStore" style="display:flex;align-items:center">
                    <div class="pick-value" @click="showPicker('accountType')">{{this.formData.accountType?showIdName(accountType.data,this.formData.accountType):accountType.tip}}
                    </div>
                    <i class="zhk-list_rarrow"></i>
                    <awesome-picker ref="accountType" :textTitle="accountType.textTitle" :data="getAwesomeData(accountType.data)" :anchor="accountType.anchor" @confirm="(v)=>handleConfirm('accountType',v,accountType.data)">
                    </awesome-picker>
                  </div>
                  <div v-else class="pick-value" >{{this.formData.accountType}}</div>
                </div>
                <div v-if="formData.accountType == '01'" class="form-item border-bt-left">
                  <div class="label">结算账户</div>
                  <div v-if="addStore" style="display:flex;align-items:center">
                    <div class="pick-value" @click="showPicker('settleAccountsType')">{{this.formData.settleAccountsType?showIdName(settleAccountsType.data,this.formData.settleAccountsType):settleAccountsType.tip}}
                    </div>
                    <i class="zhk-list_rarrow"></i>
                    <awesome-picker ref="settleAccountsType" :textTitle="settleAccountsType.textTitle" :data="getAwesomeData(settleAccountsType.data)" :anchor="settleAccountsType.anchor" @confirm="(v)=>handleConfirm('settleAccountsType',v,settleAccountsType.data)">
                    </awesome-picker>
                  </div>
                  <div v-else>{{this.formData.settleAccountsType}}</div>
                </div>
              </div>
            </div>
            <div v-if="formData.merchantType == '01'" class="form-item border-bt-left">
              <div class="label">账户类型</div>
              <div class="pick-value" >对私账户</div>
            </div>
            <div class="border-bt-all" v-if="(formData.merchantType == '03'&& formData.accountType == '01')||(formData.accountType == '02')">
              <div class="form-title ">
                对公账户信息
              </div>
            </div>
            <div v-if="formData.merchantType == '03' || (formData.merchantType == '02'&&formData.accountType == '02')"  class="store-head">
              <div class="tt">公户凭证</div>
              <div class="store-head-explain">如开户许可证、银行电子回执单、银行印鉴卡等，需要体现对公户信息及银行签章</div>
              <div  class="ct border-bt">
                  <div  class="store-head-box border-dashed" v-if="!formData.yzIndustryLicensePhoto" @click="chooseImg('yzIndustryLicensePhoto')">
                    <span class="zhk-sczp"/>
                  </div>
                  <div class="store-head-box border-solid" v-else-if="formData.yzIndustryLicensePhoto" >
                    <img :src="repeatImgUrl(formData.yzIndustryLicensePhoto,'resize')" alt="" @click="showImg(formData.yzIndustryLicensePhoto)" />
                    <span class="zhk-sbylx" @click="delImage('yzIndustryLicensePhoto')"></span>
                  </div>
              </div>
            </div>
            <div v-if="formData.merchantType == '03'&& formData.accountType == '01'">
              <div v-if="formData.merchantType != '01' && formData.accountType == '01'" class="form-item border-bt-left">
                <div class="label">公户开户名</div>
                <div class="pick-value" >{{formData.merchantCompany}}</div>
              </div>
              <mt-field v-else class="border-bt-left" label="公户开户名" placeholder="请输入公户开户人" v-model="formData.reserveBankCertName" :attr="{ maxlength: 64}"></mt-field>
              <mt-field class="border-bt-left" label="公户银行账号" placeholder="请填写公户银行账号" v-model="formData.reserveBankCardNo" :attr="{ maxlength: 28}"></mt-field>
              <div class="form-item border-bt-left">
                <div class="label">公户开户行所在地区</div>
                <div class="pick-value" @click="showPicker('reserveBranch')">{{reserveBranchAreaName?reserveBranchAreaName:reserveBranch.tip}}
                </div>
                <i class="zhk-list_rarrow"></i>
                <awesome-picker ref="reserveBranch" :textTitle="reserveBranch.textTitle" :data="reserveBranch.data" :anchor="reserveBranch.anchor" @confirm="(v)=>handleConfirm('reserveBranch',v,reserveBranch.data)">
                </awesome-picker>
              </div>
              <div  class="form-item border-bt-left" >
                <div class="label">公户开户银行</div>
                <div class="pick-value" @click="showPicker('reserveBank')">{{formData.reserveBankCode?formData.reserveBankCode:reserveBank.tip}}
                </div>
                <i class="zhk-list_rarrow"></i>
                <awesome-picker v-if="reserveBankItemVisible" ref="reserveBank" :textTitle="reserveBank.textTitle" :data="reserveBank.data" :anchor="reserveBank.anchor" @confirm="(v)=>handleConfirm('reserveBank',v,reserveBank.data)">
                </awesome-picker>
              </div>
              <div  class="form-item border-bt-left">
                <div class="label">公户开户行支行名称</div>
                <div class="pick-value" @click="showPicker('reserveBranchName')">{{formData.reserveBranchName?formData.reserveBranchName:bank.tip}}
                </div>
                <i class="zhk-list_rarrow"></i>
                <awesome-picker v-if="reserveBranchItemVisible" ref="reserveBranchName" :textTitle="reserveBranchName.textTitle" :data="reserveBranchName.data" :anchor="reserveBranchName.anchor" @confirm="(v)=>handleConfirm('reserveBranchName',v,reserveBranchName.data)">
                </awesome-picker>
              </div>
              <mt-field class="border-bt-left" label="公户联行号" placeholder="请填写联行号" v-model="formData.reserveContactLine" :attr="{ maxlength: 12}"></mt-field>
            </div>
            <div class="border-bt-all" v-if="formData.accountType != '02'">
              <div class="form-title ">
                结算账户信息
              </div>
              <div class="hint-info">
                <span class="zhk-ts"></span>
                <span class="info">以下信息非常重要，请仔细确认，任何一项信息有误都会导致结算款不到账</span>
              </div>
            </div>
            <div v-if="formData.settleAccountsType == '2'"  class="store-head">
              <div class="tt">非法人结算证明照片</div>
              <div  class="ct border-bt">
                  <div  class="store-head-box border-dashed" v-if="!formData.yzImgUnincorporated" @click="chooseImg('yzImgUnincorporated')">
                    <span class="zhk-sczp"/>
                  </div>
                  <div class="store-head-box border-solid" v-else-if="formData.yzImgUnincorporated" >
                    <img :src="repeatImgUrl(formData.yzImgUnincorporated,'resize')" alt="" @click="showImg(formData.yzImgUnincorporated)" />
                    <span class="zhk-sbylx" @click="delImage('yzImgUnincorporated')"></span>
                  </div>
              </div>
            </div>
            <div v-if="formData.accountType != '02' || formData.merchantType == '01'"  class="store-head">
              <div class="tt">银行卡照片</div>
              <div  class="ct border-bt">
                  <div  class="store-head-box border-dashed" v-if="!formData.yzImgBankcardA" @click="chooseImg('yzImgBankcardA','baidu_ocr_bankcard')">
                    <span class="zhk-sczp"/>
                  </div>
                  <div class="store-head-box border-solid" v-else-if="formData.yzImgBankcardA" >
                    <img :src="repeatImgUrl(formData.yzImgBankcardA,'resize')" alt="" @click="showImg(formData.yzImgBankcardA)" />
                    <span class="zhk-sbylx" @click="delImage('yzImgBankcardA')"></span>
                  </div>
              </div>
            </div>
            <div v-if="formData.merchantType != '01' && formData.accountType == '02'" class="form-item border-bt-left">
              <div class="label">{{formData.accountType == '02'?'公户':''}}开户名</div>
              <div class="pick-value" >{{formData.merchantCompany}}</div>
            </div>
            <div v-if="formData.merchantType != '01' && formData.accountType == '01'&&formData.settleAccountsType == '1'" class="form-item border-bt-left">
              <div class="label">{{formData.accountType == '02'?'公户':''}}开户名</div>
              <div class="pick-value" >{{formData.principalPerson}}</div>
            </div>
            <div v-if="formData.merchantType == '01'" class="form-item border-bt-left">
              <div class="label">{{formData.accountType == '02'?'公户':''}}开户名</div>
              <div class="pick-value" >{{formData.principalPerson}}</div>
            </div>
            <mt-field class="border-bt-left" :label="`${formData.accountType == '02'?'公户':''}银行账号`" placeholder="请填写银行账号" v-model="formData.bankCardNo" :attr="{ maxlength: 28}"></mt-field>
            <div class="form-item border-bt-left">
              <div class="label">{{formData.accountType == '02'?'公户':''}}开户行所在地区</div>
              <div class="pick-value" @click="showPicker('branch')">{{branchAreaName?branchAreaName:branch.tip}}
              </div>
              <i class="zhk-list_rarrow"></i>
              <awesome-picker ref="branch" :textTitle="branch.textTitle" :data="branch.data" :anchor="branch.anchor" @confirm="(v)=>handleConfirm('branch',v,branch.data)">
              </awesome-picker>
            </div>
            <div  class="form-item border-bt-left" >
              <div class="label">{{formData.accountType == '02'?'公户':''}}开户银行</div>
              <div class="pick-value" @click="showPicker('bank')">{{formData.bankCode?formData.bankCode:bank.tip}}
              </div>
              <i class="zhk-list_rarrow"></i>
              <awesome-picker v-if="bankItemVisible" ref="bank" :textTitle="bank.textTitle" :data="bank.data" :anchor="bank.anchor" @confirm="(v)=>handleConfirm('bank',v,bank.data)">
              </awesome-picker>
            </div>
            <div  class="form-item border-bt-left">
              <div class="label">{{formData.accountType == '02'?'公户开户行':''}}支行名称</div>
              <div class="pick-value" @click="showPicker('branchName')">{{formData.branchName?formData.branchName:bank.tip}}
              </div>
              <i class="zhk-list_rarrow"></i>
              <awesome-picker v-if="branchItemVisible" ref="branchName" :textTitle="branchName.textTitle" :data="branchName.data" :anchor="branchName.anchor" @confirm="(v)=>handleConfirm('branchName',v,branchName.data)">
              </awesome-picker>
            </div>
            <mt-field class="border-bt-left" :label="`${formData.accountType == '02'?'公户':''}联行号`" placeholder="请填写联行号" v-model="formData.contactLine" :attr="{ maxlength: 12}"></mt-field>
            <div v-if="formData.settleAccountsType == '2'" >
              <div  class="store-head">
                <div class="tt">身份证照片（正面）</div>
                <div  class="ct border-bt">
                    <div  class="store-head-box border-dashed" v-if="!formData.yzImgPrivateIdcardA" @click="chooseImg('yzImgPrivateIdcardA','baidu_ocr_bank_idcard_front')">
                      <img class="imgOpcity" :src="require('../../assets/images/up_bg_sa.png')" />
                      <span class="zhk-sczp"/>
                    </div>
                    <div class="store-head-box border-solid" v-else-if="formData.yzImgPrivateIdcardA" >
                      <img :src="repeatImgUrl(formData.yzImgPrivateIdcardA,'resize')" alt="" @click="showImg(formData.yzImgPrivateIdcardA)" />
                      <span class="zhk-sbylx" @click="delImage('yzImgPrivateIdcardA')"></span>
                    </div>
                </div>
              </div>
              <div  class="store-head">
                <div class="tt">身份证照片（反面）</div>
                <div  class="ct border-bt">
                    <div  class="store-head-box border-dashed" v-if="!formData.yzImgPrivateIdcardB" @click="chooseImg('yzImgPrivateIdcardB','baidu_ocr_bank_idcard_back')">
                      <img class="imgOpcity" :src="require('../../assets/images/up_bg_sb.png')" />
                      <span class="zhk-sczp"/>
                    </div>
                    <div class="store-head-box border-solid" v-else-if="formData.yzImgPrivateIdcardB" >
                      <img :src="repeatImgUrl(formData.yzImgPrivateIdcardB,'resize')" alt="" @click="showImg(formData.yzImgPrivateIdcardB)" />
                      <span class="zhk-sbylx" @click="delImage('yzImgPrivateIdcardB')"></span>
                    </div>
                </div>
              </div>
              <mt-field v-if="formData.settleAccountsType == '2'" class="border-bt-left" label="开户名" placeholder="收款银行账号的开户人名称" v-model="formData.bankCertName" :attr="{ maxlength: 64}"></mt-field>
              <mt-field class="border-bt-left" label="身份证号码" placeholder="请填写负责人身份证号码" v-model="formData.certNo" :attr="{ maxlength: 18}"></mt-field>
              <div class="form-item border-bt-left">
                <div class="label">身份证有效期</div>
                <div class="pick-value" @click="showPeriod('merchantIdExpireStart')">{{this.formData.merchantIdExpireStart && this.formData.merchantIdExpire?moment(this.formData.merchantIdExpireStart).format('YYYY-MM-DD') + ' 至 ' + (this.formData.merchantIdExpire == '29991231'?'长期':this.formData.merchantIdExpire+'年'):merchantIdExpireStart.tip}}
                </div>
                <i class="zhk-list_rarrow"></i>
                <awesome-picker ref="merchantIdExpireStart" type="date" :textTitle="merchantIdExpireStart.textTitle"  :anchor="merchantIdExpireStart.anchor"  @confirm="(v)=>showPeriod('merchantIdExpire','merchantIdExpireStart',v)">
                </awesome-picker>
                <awesome-picker ref="merchantIdExpire"  :textTitle="merchantIdExpire.textTitle" :data="merchantIdExpire.data"  :anchor="merchantIdExpire.anchor" @cancel="()=>periodCancel('merchantIdExpireStart')" @confirm="(v)=>periodConfirm('merchantIdExpire',v,merchantIdExpire.data,'merchantIdExpireStart')">
                </awesome-picker>
              </div>
            </div>
            <mt-field :class="`${formData.merchantType == '01'?'border-bt':'border-bt-left'}`" label="银行预留手机号" placeholder="请填写银行预留手机号" v-model="formData.accountPhone" :attr="{ maxlength: 11}"></mt-field>
            <div @click="appendInfo" v-if="formData.merchantType != '01'">
              <mt-cell :class="appendFlag?'border-bt-left':'border-bt'" label="附加信息（选填）" >
                <span :class="`zhk-list_rarrow ${appendFlag?'appendIcon':''}`" ></span>
              </mt-cell>
            </div>
            <div v-if="appendFlag">
              <div  class="store-head">
                <div class="tt">支付宝支付物料 (非必填)</div>
                <div  class="ct border-bt">
                    <div  class="store-head-box border-dashed" v-if="!formData.yzImgAlicashier" @click="chooseImg('yzImgAlicashier')">
                      <span class="zhk-sczp"/>
                    </div>
                    <div class="store-head-box border-solid" v-else-if="formData.yzImgAlicashier" >
                      <img :src="repeatImgUrl(formData.yzImgAlicashier,'resize')" alt="" @click="showImg(formData.yzImgAlicashier)" />
                      <span class="zhk-sbylx" @click="delImage('yzImgAlicashier')"></span>
                    </div>
                </div>
              </div>
              <div  class="store-head">
                <div class="tt">微信支付物料 (非必填)</div>
                <div  class="ct border-bt">
                    <div  class="store-head-box border-dashed" v-if="!formData.yzImgCashier" @click="chooseImg('yzImgCashier')">
                      <span class="zhk-sczp"/>
                    </div>
                    <div class="store-head-box border-solid" v-else-if="formData.yzImgCashier" >
                      <img :src="repeatImgUrl(formData.yzImgCashier,'resize')" alt="" @click="showImg(formData.yzImgCashier)" />
                      <span class="zhk-sbylx" @click="delImage('yzImgCashier')"></span>
                    </div>
                </div>
              </div>
              <div  class="store-head">
                <div class="tt">第三方平台截图 (非必填)</div>
                <div class="store-head-explain">大众点评、美团、口碑、饿了么任选一个</div>
                <div  class="ct border-bt">
                    <div  class="store-head-box border-dashed" v-if="!formData.yzSettledPic" @click="chooseImg('yzSettledPic')">
                      <span class="zhk-sczp"/>
                    </div>
                    <div class="store-head-box border-solid" v-else-if="formData.yzSettledPic" >
                      <img :src="repeatImgUrl(formData.yzSettledPic,'resize')" alt="" @click="showImg(formData.yzSettledPic)" />
                      <span class="zhk-sbylx" @click="delImage('yzSettledPic')"></span>
                    </div>
                </div>
              </div>
              <div  class="store-head">
                <div class="tt">业务员门头海报合照 (非必填)</div>
                <div  class="ct border-bt">
                    <div  class="store-head-box border-dashed" v-if="!formData.yzImgSalesmanPoster" @click="chooseImg('yzImgSalesmanPoster')">
                      <span class="zhk-sczp"/>
                    </div>
                    <div class="store-head-box border-solid" v-else-if="formData.yzImgSalesmanPoster" >
                      <img :src="repeatImgUrl(formData.yzImgSalesmanPoster,'resize')" alt="" @click="showImg(formData.yzImgSalesmanPoster)" />
                      <span class="zhk-sbylx" @click="delImage('yzImgSalesmanPoster')"></span>
                    </div>
                </div>
              </div>
              <div  class="store-head">
                <div class="tt">业务员门头合照 (非必填)</div>
                <div  class="ct border-bt">
                    <div  class="store-head-box border-dashed" v-if="!formData.yzImgSalesmanLogo" @click="chooseImg('yzImgSalesmanLogo')">
                      <span class="zhk-sczp"/>
                    </div>
                    <div class="store-head-box border-solid" v-else-if="formData.yzImgSalesmanLogo" >
                      <img :src="repeatImgUrl(formData.yzImgSalesmanLogo,'resize')" alt="" @click="showImg(formData.yzImgSalesmanLogo)" />
                      <span class="zhk-sbylx" @click="delImage('yzImgSalesmanLogo')"></span>
                    </div>
                </div>
              </div>
              <div  class="store-head">
                <div class="tt">经营许可证 (非必填)</div>
                <div  class="ct border-bt">
                    <div  class="store-head-box border-dashed" v-if="!formData.yzBusinessLicense" @click="chooseImg('yzBusinessLicense')">
                      <span class="zhk-sczp"/>
                    </div>
                    <div class="store-head-box border-solid" v-else-if="formData.yzBusinessLicense" >
                      <img :src="repeatImgUrl(formData.yzBusinessLicense,'resize')" alt="" @click="showImg(formData.yzBusinessLicense)" />
                      <span class="zhk-sbylx" @click="delImage('yzBusinessLicense')"></span>
                    </div>
                </div>
              </div>
              <div  class="store-head">
                <div class="tt">食品经营许可证 (非必填)</div>
                <div  class="ct border-bt">
                    <div  class="store-head-box border-dashed" v-if="!formData.yzBusinessLicenseFood" @click="chooseImg('yzBusinessLicenseFood')">
                      <span class="zhk-sczp"/>
                    </div>
                    <div class="store-head-box border-solid" v-else-if="formData.yzBusinessLicenseFood" >
                      <img :src="repeatImgUrl(formData.yzBusinessLicenseFood,'resize')" alt="" @click="showImg(formData.yzBusinessLicenseFood)" />
                      <span class="zhk-sbylx" @click="delImage('yzBusinessLicenseFood')"></span>
                    </div>
                </div>
              </div>
              <div  class="store-head">
                <div class="tt">低费率证明 (非必填)</div>
                <div  class="ct border-bt">
                    <div  class="store-head-box border-dashed" v-if="!formData.yzZeroRatesPhoto" @click="chooseImg('yzZeroRatesPhoto')">
                      <span class="zhk-sczp"/>
                    </div>
                    <div class="store-head-box border-solid" v-else-if="formData.yzZeroRatesPhoto" >
                      <img :src="repeatImgUrl(formData.yzZeroRatesPhoto,'resize')" alt="" @click="showImg(formData.yzZeroRatesPhoto)" />
                      <span class="zhk-sbylx" @click="delImage('yzZeroRatesPhoto')"></span>
                    </div>
                </div>
              </div>
              <div  class="store-head border-bt">
                <div class="tt">绿洲承诺函(非必填)</div>
                <div  class="ct">
                    <div  class="store-head-box border-dashed" v-if="!formData.yzImgGreenAnnex" @click="chooseImg('yzImgGreenAnnex')">
                      <span class="zhk-sczp"/>
                    </div>
                    <div class="store-head-box border-solid" v-else-if="formData.yzImgGreenAnnex" >
                      <img :src="repeatImgUrl(formData.yzImgGreenAnnex,'resize')" alt="" @click="showImg(formData.yzImgGreenAnnex)" />
                      <span class="zhk-sbylx" @click="delImage('yzImgGreenAnnex')"></span>
                    </div>
                </div>
              </div>
            </div>
            <div class="btn-box">
              <div class="form-title-center">
                <i :class="isChecked?'zhk-ty':'zhk-wxz'"  @click="isChecked = !isChecked"/>
                <label>我已阅读并同意
                  <span @click="hlwskProtocol = true">《互联网收款服务协议》</span>
                  <span @click="ydzfsdProtocol = true">《移动支付收单服务协议》</span>
                </label>
              </div>
              <mt-button class="btn" type="primary" @click="submit">提交</mt-button>
            </div>
            </div>
        </div>
      </div>
  </div>
</template>
<script>
  import Vue from "vue";
  import customHeader from "../../components/header/header";
  import hlwsk from "../../components/protocol/hlwsk";
  import ydzfsd from "../../components/protocol/ydzfsd";
  import { Field, Toast, MessageBox, Button } from "mint-ui";
  import jsBridge from "../../tools/jsBridge";
  import AwesomePicker from "vue-awesome-picker";
  import config from "../../base/profile/config.json";
  import shopService from "../../js/shopService";
  import inputClear from "../../components/inputClear/inputClear";
  import CitysPicker from "vue-citys-picker";
  require("vue-citys-picker/dist/vue-citys-picker.css");
  import moment from "moment";
  Vue.use(AwesomePicker);
  export default {
    name: "openShroffAccount",
    data(){
      return{
        moment:moment,
        ocrChangeFlag:false,
        //从哪一页跳转过来的
        routerFrom:'',
        //处理下拉弹窗无法滚动
        bankItemVisible:true,
        reserveBankItemVisible:true,
        branchItemVisible:true,
        reserveBranchItemVisible:true,
        //创建门点跳转过来
        addStore:'false',
        //协议
        hlwskProtocol:false,
        ydzfsdProtocol:false,
        isChecked:false,//检查协议
        firstStep:true,//第一步
        //选择照片组件
        actions: [],
        chooseImgVisible:false,
        //门店区域fuyou数据
        storeAreaData:[],
        //门店区域拼接字段
        storeAreaName:'',
        dataArea: JSON.parse(JSON.stringify(addressUtility.getAreaList())),
        //所属类目拼接字段
        categorySplice:'',
        //开户行拼接字段
        branchAreaName:'',
        //公户开户行拼接字段
        reserveBranchAreaName:'',
        //经营类目拼接字段
        mccSpliceName:'',
        payType:0,
        //表单数据
        formData:{
          shopId:'',//门店id
          merchantId:'',
          servicePhoneNo:'',//客服电话
          province:'',//省code
          provinceName:'',//省name
          city:'',//市code
          cityName:'',//市name
          district:'',//区code
          districtName:'',//区name
          address:'',//门店地址
          yzShopPhoto:'',//门头照
          yzCheckstandPic:'',//收银照
          yzIndoorPic:'',//内景照
          merchantType:'03',//商户类型
          merchantCompany:'',//公司全称
          yzLicensePhoto:'',//营业执照照片
          bussAuthNum:"",//营业执照注册号
          yzLicenseRegisterAddress:"",//营业执照注册地址
          principalPerson:"",//法人姓名
          licenseExpireStart:'',//营业执照有效期起始时间
          licenseExpire:'',//营业执照有效期使用年限
          licenseType:'1',//是否三证合一
          yzCertPhotoa:'',//身份证照正面
          yzCertPhotob:'',//身份证照反面
          yzImgIdcardHolding:'',//手持
          principalCertno:'',//身份证号
          legalIdnumExpireStart:'',//身份证有效期起始时间
          legalIdnumExpire:'',//身份证有效期使用年限
          merchantName:'',//商户名称
          mcc:'',//经营类目
          mccName:'',//经营类目名称
          mccRout:'',
          alias:'',//门店简称
          principalMobile:'',//负责人手机号
          email:'',//邮箱
          yzImgStandardProtocol:'',//连锁关系证明照片
          yzPrgPhoto:'',//组织机构代码证照片
          yzImgTaxReg:'',//税务登记证照片
          accountType:'02',//商户类型
          settleAccountsType:'',//结算账户
          yzImgUnincorporated:'',//非法人结算证明照片
          yzIndustryLicensePhoto:'',//开户许可证照片
          yzImgBankcardA:'',//银行卡正面照
          reserveBankCertName:'',//公户开户名
          reserveBankCardNo:'',//公户卡号
          reserveBranchProvince:'',//公户开户行省code
          reserveBranchProvinceName:'',//公户开户行省名称
          reserveBranchCity:'',//公户开户行城市code
          reserveBranchCityName:'',//公户开户行城市名称
          reserveBankId:'',//公户开户银行ID
          reserveBankCode:'',//公户开户银行名称
          reserveBranchName:'',//公户支行名称
          reserveContactLine:'',//公户联行号
          bankCertName:'',//开户名
          bankCardNo:'',//银行账号
          branchProvince:'',//开户行省code
          branchProvinceName:'',//开户行省名称
          branchCity:'',//开户行城市code
          branchCityName:'',//开户行城市名称
          bankId:'',//开户银行ID
          bankCode:'',//开户银行名称
          branchName:'',//支行名称
          contactLine:'',//联行号
          accountPhone:'',//银行预留手机号
          yzImgPrivateIdcardA:'',//对私非法人身份证正面照
          yzImgPrivateIdcardB:'',//对私非法人身份证反面照
          certNo:'',//非法人身份证号
          merchantIdExpireStart:'',//非法人身份证有效期开始时间
          merchantIdExpire:'',//非法人身份证有效期
          yzImgAlicashier:'',//支付宝支付物料照片
          yzImgCashier:'',//微信支付物料照片
          yzSettledPic:'',//第三方平台截图
          yzBusinessLicense:'',//经营许可证
          yzBusinessLicenseFood:'',//食品经营许可证
          yzZeroRatesPhoto:'',//零费率证明
          yzImgGreenAnnex:'',//绿洲活动
          yzImgSalesmanPoster:'',//业务员门店海报合照
          yzImgSalesmanLogo:'',//业务员门头合照
        },
        ocrData:{
                 bussAuthNumOcr:'',//注册号
                 merchantCompanyOcr:'',//公司名称
                 licenseExpireStartOcr:'',//公司注册日期
                 licenseExpireOcr:'',//营业期限终止日期
                 principalPersonOcr:'',//公司法人
                 businessTypeOcr:'',//公司类型
                 businessAddressOcr:'',//公司地址
                 businessCapitalOcr:'',//注册资本
                 businessOcr:'',//经营范围
                 principalCertnoOcr:'',//身份证号
                 idcardNameOcr:'',//姓名
                 idcardNationalityOcr:'',//民族
                 idcardSexOcr:'',//性别
                 idcardBirthOcr:'',//出生日期
                 idcardAddressOcr:'',//地址信息
                 legalIdnumExpireStartOcr:'',//有效期起始时间
                 legalIdnumExpireOcr:'',//有效期结束时间
                 idcardIssueOcr:'',//签发机关
                 bankCardNoOcr:'',//银行卡账号
                 bankCardNameOcr:'',//银行卡名字
                 certNoOcr : '',//收款账号身份证号
                 bankCertNameOcr :'',//收款账号姓名
                 bankIdcardNationalityOcr: '',//收款账号民族
                 bankIdcardSexOcr:'',//收款账号性别
                 bankIdcardBirthOcr:'',//收款账号出生日期
                 bankIdcardAddressOcr:'',//收款账号地址信息
                 merchantIdExpireStartOcr :'',//收款账号有效期起始时间
                 merchantIdExpireOcr: '',//收款账号有效期结束时间
                 bankIdcardIssueOcr:'',//收款账号签发机关
        },
        //选择图片弹窗激活判断
        chooseImgVisible:false,
        //选择图片弹窗配置
        actions:[],
        //所属类目
        category: {
          tip:"请选择",
          anchor: [],
          textTitle: "请选择所属类目",
          data: []
        },
        //门店区域
        storeArea: {
          tip:"请选择省、市、区(县)",
          anchor: [],
          textTitle: "门店区域",
          data: []
        },
        //商户类型
        merchantType: {
          tip:"请选择",
          anchor: [0],
          textTitle: "请选择门店类型",
          data: [{key:'03',value:'企业商户'},{key:'02',value:'个体工商户'},{key:'01',value:'自然人'}]
        },
        //营业执照有效期
        licenseExpireStart:{
          tip:"请选择",
          anchor: [],
          textTitle: "营业执照有效期",
        },
        //营业执照有效期使用年限
        licenseExpire:{
          anchor: [],
          textTitle: "使用年限",
          data: [{key:'1',value:'1年'},{key:'2',value:'2年'},{key:'3',value:'3年'},{key:'4',value:'4年'},{key:'5',value:'5年'},{key:'6',value:'6年'},{key:'7',value:'7年'},{key:'8',value:'8年'},{key:'9',value:'9年'},{key:'10',value:'10年'},{key:'20',value:'20年'},{key:'30',value:'30年'},{key:'40',value:'40年'},{key:'50',value:'50年'},{key:'60',value:'60年'},{key:'70',value:'70年'},{key:'29991231',value:'长期'}]
        },
        //是否三证合一
       licenseType:{
         tip:"请选择",
         anchor: [0],
         textTitle: "是否三证合一",
         data: [{key:'1',value:'是'},{key:'0',value:'不是'}]
       },
       //身份证有效期
       legalIdnumExpireStart:{
         tip:"请选择",
         anchor: [],
         textTitle: "身份证有效期",
       },
       //身份证有效期使用年限
       legalIdnumExpire:{
         anchor: [],
         textTitle: "使用年限",
         data: [{key:'5',value:'5年'},{key:'10',value:'10年'},{key:'20',value:'20年'},{key:'29991231',value:'长期'}]
       },
       //非法人身份证有效期
       merchantIdExpireStart:{
         tip:"请选择",
         anchor: [],
         textTitle: "身份证有效期",
       },
       //非法人身份证有效期使用年限
       merchantIdExpire:{
         anchor: [],
         textTitle: "使用年限",
         data: [{key:'5',value:'5年'},{key:'10',value:'10年'},{key:'20',value:'20年'},{key:'29991231',value:'长期'}]
       },

       //账户类型
        accountType:{
          tip:"请选择",
          anchor: [0],
          textTitle: "账户类型",
          data: [{key:'02',value:'对公账户'},{key:'01',value:'对私账户'}]
        },
        //结算账户
        settleAccountsType:{
          tip:"请选择",
          anchor: [0],
          textTitle: "结算账户",
          data: [{key:'1',value:'法人'},{key:'2',value:'非法人'}]
        },
        //经营类目
        mcc:{
          tip:"请选择",
          anchor: [0],
          textTitle: "经营类目",
          data: []
        },
        //开户银行
        bank:{
          tip:"请选择",
          anchor: [0],
          textTitle: "开户银行",
          data: []
        },
        //公户开户银行
        reserveBank:{
          tip:"请选择",
          anchor: [0],
          textTitle: "公户开户银行",
          data: []
        },
        //公户开户行所在地区
        reserveBranch:{
          tip:"请选择",
          anchor: [0],
          textTitle: "公户开户行所在地区",
          data: []
        },
        //开户行所在地区
         branch:{
           tip:"请选择",
           anchor: [0],
           textTitle: "开户行所在地区",
           data: []
         },
         //公户支行名称
         reserveBranchName:{
           tip:"请选择",
           anchor: [0],
           textTitle: "公户支行名称",
           data: []
         },
         //支行名称
         branchName:{
           tip:"请选择",
           anchor: [0],
           textTitle: "支行名称",
           data: []
         },
       //展开判断
       appendFlag:false,
      }
    },
    created(){
      //创建门点调过来
      if(this.$route.query.addStore){
        this.addStore = this.$route.query.addStore;
        this.firstStep = false;
      };
      if(this.$route.query.payType){
        this.payType = this.$route.query.payType;
      };

    },
    mounted(){
      this.loadCategory();
      this.getCityMapped();
    },
    methods:{
      storeAreaShow(citys) {
        this.$refs["citys"].open();
      },
      storeAreaConfirm(values) {
        this.formData.provinceName = values[0].name;
        this.formData.cityName = values[1].name;
        this.formData.districtName = values[2].name;
        this.formData.province = values[0].value;//省code
        this.formData.city= values[1].value;//市code
        this.formData.district= values[2].value;//区code
        this.storeAreaName = values[0].name + "-" + values[1].name + "-" + values[2].name;
      },
      repeatImgUrl(url,resize){
        if(resize){
          return CommonUtil.imgUrlFormate(url,config.previewUrlPrefix)+"?"+CommonUtil.imgUrlResize('m_fill','230','360');
        }
        return CommonUtil.imgUrlFormate(url,config.previewUrlPrefix)
      },
      cutImgUrl(url){
        if (url && url.indexOf("http") != -1) {
          var index = CommonUtil.find(url, ".com", 2);
          let cutUrl = '';
          let newUrl = url.substr(index+4)
          const cutUrlFuc = (url) =>{
            if(url[0] == '/'){
              cutUrlFuc(url.substr(1))
            }else{
              cutUrl = url
            }
          }
          cutUrlFuc(newUrl)
          return cutUrl
        }else{
          return url
        }
      },
      checkRepeat(){
        const params = {
          merchantName:this.formData.merchantName
        }
        this.ajax({
          type: "get",
          url: "/app/AppMerchant/checkMerchantCompany.do?merchantName="+this.formData.merchantName,
        })
          .then((response) =>{
            if (response && response.success) {
              Toast('商户名称可用')
            } else {
              Toast(response.msg)
            }
          })
          .catch((err)=> {

          });
      },
      loadFailInfo(){
          let shopId = this.$route.query.shopId || '';
          this.ajax({
            url: "/app/AppMerchant/queryMerchantDetailForAnt.do?shopId=" + shopId,
            type: "get",
            controlLoading: true
          })
            .then((res) => {
              if (res.success) {
                if(res.resultObject.merchantDetailModel&&JSON.stringify(res.resultObject.merchantDetailModel)!='{}'){
                  for(let formKey in this.formData){
                    for(let key in res.resultObject.merchantBankCardParamModel){
                      if(formKey == key){
                        this.formData[formKey] = res.resultObject.merchantBankCardParamModel[key];
                      }
                    }
                    for(let key in res.resultObject.merchantDetailModel){
                      if(formKey == key){
                        this.formData[formKey] = res.resultObject.merchantDetailModel[key];
                      }
                    }
                    for(let key in res.resultObject){
                      if(formKey == key){
                        this.formData[formKey] = res.resultObject[key];
                      }
                    }
                  }
                  const mccRout = this.formData.mccRout.split(',');
                  if(this.formData.merchantType == '03'&& this.formData.accountType == '01'){
                    this.getReserveBank();
                    this.getReserveBranchName();
                  }
                  this.getBank();
                  this.getBranchName();
                  this.getMccData();
                  this.formData.settleAccountsType = res.resultObject.settlementType;
                  this.formData.yzLicensePhoto = this.formData.yzLicensePhoto?this.cutImgUrl(this.formData.yzLicensePhoto):'';
                  this.formData.yzShopPhoto = this.formData.yzShopPhoto?this.cutImgUrl(this.formData.yzShopPhoto):'';
                  this.formData.yzCheckstandPic = this.formData.yzCheckstandPic?this.cutImgUrl(this.formData.yzCheckstandPic):'';
                  this.formData.yzIndoorPic = this.formData.yzIndoorPic?this.cutImgUrl(this.formData.yzIndoorPic):'';
                  this.formData.merchantIdExpireStart = this.formData.merchantIdExpireStart?this.changeMoment(this.formData.merchantIdExpireStart):'';
                  this.formData.licenseExpireStart = this.formData.licenseExpireStart?this.changeMoment(this.formData.licenseExpireStart):'';
                  this.formData.legalIdnumExpireStart = this.formData.legalIdnumExpireStart?this.changeMoment(this.formData.legalIdnumExpireStart):'';
                  if (!this.formData.province || !this.formData.city || !this.formData.district || !this.formData.provinceName || !this.formData.cityName || !this.formData.districtName) {
                    this.storeAreaName = '';
                  }else{
                    this.storeAreaName = (this.formData.provinceName || '') +  (this.formData.cityName?' - ' + this.formData.cityName:'') + (this.formData.districtName?' - ' + this.formData.districtName:'');
                  };
                  this.mccSpliceName = this.showIdName(this.mcc.data,mccRout[0]) + " - " + this.showIdName(this.mcc.data,mccRout[1])
                  if(this.formData.branchProvinceName&&this.formData.branchCityName&&this.formData.branchProvince&&this.formData.branchCity){
                    this.branchAreaName = this.formData.branchProvinceName + " - " + this.formData.branchCityName;
                  }
                  if(this.formData.reserveBranchProvince&&this.formData.reserveBranchProvinceName&&this.formData.reserveBranchCity&&this.formData.reserveBranchCityName){
                    this.reserveBranchAreaName = this.formData.reserveBranchProvinceName + " - " + this.formData.reserveBranchCityName;
                  }

                }else{
                  this.loadShopInfo();
                }
              } else {
                Toast("加载门店信息失败");
              }
          })
      },
      //获取门店详情
      loadShopInfo() {
        let shopId = this.$route.query.shopId || '';
        this.ajax({
          url: "/newapp/shop/getMerchantShopDetail.do?shopId=" + shopId,
          type: "get",
          controlLoading: true
        })
          .then((res) => {
            if (res.success) {
                const data = res.resultObject;
                this.formData.shopId = shopId;
                this.formData.merchantType = data.shopType;
                this.formData.yzLicensePhoto = data.businessLicenseImage?this.cutImgUrl(data.businessLicenseImage):'';
                this.formData.merchantCompany = data.companyName;
                this.formData.bussAuthNum = data.businessLicense;
                this.formData.yzLicenseRegisterAddress = data.licenseRegisterAddress;
                this.formData.licenseExpireStart = data.licenseExpireStart?this.changeMoment(data.licenseExpireStart):'';
                this.formData.licenseExpire = data.licenseExpire;
                this.formData.licenseType = data.licenseType.toString();
                this.formData.yzCertPhotoa = data.idcardImage?this.cutImgUrl(data.idcardImage.A):'';
                this.formData.yzCertPhotob = data.idcardImage?this.cutImgUrl(data.idcardImage.B):'';
                this.formData.principalPerson = data.businessOperatorName;
                this.formData.principalCertno = data.idcard;
                this.formData.legalIdnumExpireStart = data.idcardValidStartDate?this.changeMoment(data.idcardValidStartDate):'';
                this.formData.legalIdnumExpire = data.idcardValidEndDate;
                this.formData.servicePhoneNo = data.contactNumber;
                this.formData.province = data.provinceCode;
                this.formData.provinceName = data.provinceName;
                this.formData.city = data.cityCode;
                this.formData.cityName = data.cityName;
                this.formData.district = data.districtCode;
                this.formData.districtName = data.districtName;
                this.formData.address = data.address;
                this.formData.yzShopPhoto = data.mainImage[0]?this.cutImgUrl(data.mainImage[0]):'';
                this.formData.yzCheckstandPic = data.checkoutImage[0]?this.cutImgUrl(data.checkoutImage[0]):'';
                this.formData.yzIndoorPic = data.innerImage[0]?this.cutImgUrl(data.innerImage[0]):'';
                this.categorySplice = (data.categoryLevel1 || '') +  (data.categoryLevel2?' - ' + data.categoryLevel2:'') + (data.categoryLevel3?' - ' + data.categoryLevel3:'');
                if (!this.formData.province || !this.formData.city || !this.formData.district || !this.formData.provinceName || !this.formData.cityName || !this.formData.districtName) {
                  this.storeAreaName = '';
                }else{
                  this.storeAreaName = (this.formData.provinceName || '') +  (this.formData.cityName?' - ' + this.formData.cityName:'') + (this.formData.districtName?' - ' + this.formData.districtName:'');
                };
                this.formData.merchantName = data.mainShopName + (data.branchShopName?'('+data.branchShopName+')':'');
                if(this.formData.merchantType == '01'){
                  this.formData.accountType ='01'
                }
                if(this.formData.licenseType == '0'){
                  this.formData.accountType = '02'
                }
                this.getMccData();
              } else {
                Toast("加载门店信息失败");
              }
          })
          .catch((err) =>{
            // MessageBox.alert("获取门店信息异常，请稍候重试").then(action => {
            //   this.$router.back();
            // });
          });
      },
      //请求*******************************
      //所属类目数据请求
      loadCategory() {
        this.ajax({
          type: "get",
          url: "/newapp/shop/queryCategory.do"
        })
          .then((response) =>{
            if (response && response.success) {
              var categoryList = this.getResetCategory(response.resultObject, 0);
              this.category.data = categoryList;
            } else {
              Toast("加载所属类目失败");
            }
          })
          .catch((err)=> {
            MessageBox.alert("获取数据异常，请稍候重试").then(action => {
              this.$router.push({ path: "/storeManage",query: CommonUtil.concatSessionId({}) });
            });
          });
      },
      //经营类目
      getMccData(){
        this.ajax({
          type: "get",
          url: "/app/AppMerchant/getYzProJinjianCategoryModel.do?merchant_type="+this.formData.merchantType
        })
          .then((response)=> {
            if (response && response.success) {
              const mccData = response.resultObject;
              //对经营类目进行数据处理
              this.mcc.data = this.resetMccData(mccData);
              if(this.formData.mccRout){
                const mccRout = this.formData.mccRout.split(',');
                this.mccSpliceName = this.showIdName(this.mcc.data,mccRout[0]) + " - " + this.showIdName(this.mcc.data,mccRout[1])
              }
            } else {
              Toast("加载经营类目失败");
            }
          })
          .catch((err) =>{
            MessageBox.alert("获取数据异常，请稍候重试").then(action => {
              this.$router.push({ path: "/storeManage",query: CommonUtil.concatSessionId({}) });
            });
          });
      },
      //开户行所在地区
      getCityMapped(){
        this.ajax({
          type: "get",
          url: "/newapp/AppMerchant/getCityMapped.do"
        })
          .then((response)=> {
            if (response && response.success) {
              if(this.$route.query.payType || this.$route.query.payType == 0){
                this.loadFailInfo();
              }else{
                this.loadShopInfo();
              }

              const branchData = response.resultObject;
              this.branch.data = this.resetBranchAreaData(branchData);
              this.reserveBranch.data = this.resetBranchAreaData(branchData);
              this.storeArea.data = this.resetStoreAreaData(branchData);
              this.storeAreaData = this.storeArea.data;
            } else {
              Toast("加载开户行所在地区失败");
            }
          })
          .catch((err) =>{
            MessageBox.alert("获取数据异常，请稍候重试").then(action => {
              this.$router.push({ path: "/storeManage",query: CommonUtil.concatSessionId({}) });
            });
          });
      },
      //开户银行
      getBank(){
        this.ajax({
          type: "get",
          url: "/app/AppMerchant/queryMerchantBankCode.do?province=" + (this.formData.branchProvince || '') +'&city='+(this.formData.branchCity || '')
        })
          .then((response)=> {
            if (response && response.success) {
              const bankData = response.resultObject;
              //对开户银行数据处理

              this.bank.data = this.resetBankData(bankData)
              this.bankItemVisible = true;
            } else {
              Toast("加载开户银行失败");
            }
          })
          .catch((err) =>{
            this.bankItemVisible = true;
            MessageBox.alert("获取数据异常，请重新选择开户行所在地区").then(action => {

            });
          });
      },
      //公户开户银行
      getReserveBank(){
        this.ajax({
          type: "get",
          url: "/app/AppMerchant/queryMerchantBankCode.do?province=" + (this.formData.reserveBranchProvince || '') +'&city='+(this.formData.reserveBranchCity || '')
        })
          .then((response)=> {
            if (response && response.success) {
              const bankData = response.resultObject;
              //对开户银行数据处理
              this.reserveBank.data = this.resetBankData(bankData)
              this.reserveBankItemVisible = true;
            } else {
              Toast("加载公户开户银行失败");
            }
          })
          .catch((err) =>{
            this.reserveBankItemVisible = true;
            MessageBox.alert("获取数据异常，请重新选择开户行所在地区").then(action => {

            });
          });
      },
      //获取公户支行名称
      getReserveBranchName(){
        this.ajax({
          type: "get",
          url: "/app/AppMerchant/queryMerchantBankName.do?province=" + (this.formData.reserveBranchProvince || '') +'&city='+(this.formData.reserveBranchCity || '')+'&parentId='+(this.formData.reserveBankId || '')
        })
          .then((response)=> {
            if (response && response.success) {
              const branchData = response.resultObject;
              //对开户银行数据处理
              this.reserveBranchName.data = this.resetBranchData(branchData)
              this.reserveBranchItemVisible = true;
            } else {
              Toast("加载支行名称失败");
            }
          })
          .catch((err) =>{
            this.reserveBranchItemVisible = true;
            MessageBox.alert("获取数据异常，请重新选择开户银行").then(action => {

            });
          });
      },
      //获取支行名称
      getBranchName(){

        this.ajax({
          type: "get",
          url: "/app/AppMerchant/queryMerchantBankName.do?province=" + (this.formData.branchProvince || '') +'&city='+(this.formData.branchCity || '')+'&parentId='+(this.formData.bankId || '')
        })
          .then((response)=> {
            if (response && response.success) {
              const branchData = response.resultObject;
              //对开户银行数据处理
              this.branchName.data = this.resetBranchData(branchData)
              this.branchItemVisible = true;
            } else {
              Toast("加载支行名称失败");
            }
          })
          .catch((err) =>{
            this.branchItemVisible = true;
            MessageBox.alert("获取数据异常，请重新选择开户银行").then(action => {

            });
          });
      },
      //上传图片到服务器
      doUploadPic: function(type, result, ocr ) {
        var serverUrl = window.APP.serverUrl;
        var url = serverUrl + "/newapp/img/uploadShopImg.do";
        let params = {};
        if(ocr == 'baidu_ocr_business_license'){
          url = serverUrl + "/newapp/imgManage/uploadOCRImage.do";//ocr识别上传地址
          params.code = 'ocr_business_license';
          params.uploadType = '03'
        }
        //身份证正面ocr
        if(ocr == 'baidu_ocr_idcard_front' || ocr == 'baidu_ocr_bank_idcard_front'){
          url = serverUrl + "/newapp/imgManage/uploadOCRImage.do";//ocr识别上传地址
          params.code = 'ocr_idcard';
          params.cardSide = 'front';
          params.uploadType = '01';
        }
        //身份证反面ocr
        if(ocr == 'baidu_ocr_idcard_back' || ocr == 'baidu_ocr_bank_idcard_back'){
          url = serverUrl + "/newapp/imgManage/uploadOCRImage.do";//ocr识别上传地址
          params.code = 'ocr_idcard';
          params.cardSide = 'back';
          params.uploadType = '02';
        }
        if(ocr == 'baidu_ocr_bankcard'){
          url = serverUrl + "/newapp/imgManage/uploadOCRImage.do";//ocr识别上传地址
          params.code = 'ocr_bankcard';
          params.uploadType = '07'
        }

        jsBridge.doUploadPic(
          {
            url: url,
            file: result.resultObject,
            data: params,
            //限制图片的大小压缩后最大1.2M
            compress: { sizeLimit: "1", unit: "M" }
          },
          (result) =>{
            //以下为正常的业务逻辑
            if (result && result.success) {
              var uploadResult = result.resultObject;
              if (uploadResult && uploadResult.imageUrl) {
                var url = uploadResult.imageUrl;
                if(typeof(this.formData[type]) == 'string'){
                  this.formData[type] = url;
                }
                if(typeof(this.formData[type]) == 'object'){
                  this.formData[type].push(url);
                }
              }
              //ocr 图像识别
              if(ocr){
                if(uploadResult.ocrSuccess&&Object.keys(JSON.parse(uploadResult.ocrResult)).length != 0){
                  this.ocrChangeFlag = true;
                  let ocrData = JSON.parse(uploadResult.ocrResult);//ocr识别出的数据
                  const formData = this.formData;//表单填写的数据
                  //识别营业执照
                  if(ocr == 'baidu_ocr_business_license'){
                    let flag = false;
                    let messageText = "";
                    //公司全称
                    if(!formData.merchantCompany || formData.merchantCompany == ocrData.name){
                      this.formData.merchantCompany = ocrData.name;
                    }else{
                      if(ocrData.name){
                        flag = true;
                        messageText = messageText + "<div style='display:flex'><div>公司全称：</div><div style='flex:1;word-wrap:break-word;word-break:break-all'>"+ocrData.name+"</div></div>";
                      }

                    }
                    //法人 - 经营者 - 申请人 姓名
                    // if(!formData.principalPerson || formData.principalPerson == ocrData.person){
                    //   this.formData.principalPerson = ocrData.person;
                    // }else{
                    //   flag = true;
                    //   messageText = messageText + "<div style='display:flex'><div>" + this.principalNameLb() + "姓名：</div><div style='width:70%;word-wrap:break-word'>"+ocrData.person+"</div></div>";
                    // }
                    //营业执照注册号
                    if(!formData.bussAuthNum || formData.bussAuthNum == ocrData.regNum){
                      this.formData.bussAuthNum = ocrData.regNum;
                    }else{
                      if(ocrData.regNum){
                        flag = true;
                        messageText = messageText + "<div style='display:flex'><div>" + "营业执照注册号：</div><div style='flex:1;word-wrap:break-word;word-break:break-all'>"+ocrData.regNum+"</div></div>";
                      }
                    }
                    // //公司类型
                    // if(!formData.merchantType || formData.merchantType == ocrData.type){
                    //   this.formData.merchantType = ocrData.type;
                    // }else{
                    //   flag = true;
                    //   messageText = messageText +'商户类型：'+ ocrData.type+'<br/>';
                    // }
                    //营业执照有效期
                    let establishDate = ocrData.establishDate?ocrData.establishDate:'';//ocr返回的是‘20190101’转换成‘2019-01-02’格式
                    let validPeriod = ocrData.validPeriod?ocrData.validPeriod:'';
                    const startYear = moment(establishDate.replace(/-/g,"/")).format('YYYY');
                    const endYear = moment(validPeriod.replace(/-/g,"/")).format('YYYY');
                    let difference = endYear - startYear;
                    if(difference <= 0){
                      validPeriod ='';
                    };
                    if((!formData.licenseExpireStart || formData.licenseExpireStart == establishDate) && (!formData.licenseExpire || formData.licenseExpire == (validPeriod == '2999-12-31'?'29991231':validPeriod ))){
                      if(establishDate && validPeriod){
                        this.formData.licenseExpireStart = establishDate;//起始时间
                        if(difference > 70){
                          this.formData.licenseExpire = '29991231';//结束时间
                          validPeriod = '29991231';
                        }else{
                          this.formData.licenseExpire = difference;
                          validPeriod = difference;
                        }
                      }else{
                        this.formData.licenseExpireStart = '';//起始时间
                        this.formData.licenseExpire = '';//结束时间
                      }
                    }else{
                      if(establishDate && validPeriod){
                        flag = true;
                        if(difference > 70){
                          validPeriod = '29991231';//结束时间
                        }else{
                          validPeriod = difference;
                        }
                        messageText = messageText + "<div style='display:flex'><div>" + "营业执照有效期：</div><div style='flex:1;word-wrap:break-word;word-break:break-all'>"+ establishDate + " 至 " + (validPeriod == '29991231'?'长期':difference+'年') + "</div></div>";
                      }
                    }

                    //营业执照注册地址
                    if(!formData.yzLicenseRegisterAddress || formData.yzLicenseRegisterAddress == ocrData.address){
                      this.formData.yzLicenseRegisterAddress = ocrData.address;
                    }else{
                      if(ocrData.address){
                        flag = true;
                        messageText = messageText + "<div style='display:flex'><div>" + "营业执照注册地址：</div><div style='flex:1;word-wrap:break-word;word-break:break-all'>"+ocrData.address+"</div></div>";
                      }
                    }
                    this.ocrData.bussAuthNumOcr = ocrData.regNum || '';//注册号
                    this.ocrData.merchantCompanyOcr = ocrData.name || '';//公司名称
                    this.ocrData.licenseExpireStartOcr = establishDate || '';//公司注册日期
                    this.ocrData.licenseExpireOcr = validPeriod;//营业期限终止日期
                    this.ocrData.principalPersonOcr = ocrData.person || '';//公司法人
                    this.ocrData.businessTypeOcr = ocrData.type || '';//公司类型
                    this.ocrData.businessAddressOcr = ocrData.address || '';//公司地址
                    this.ocrData.businessCapitalOcr = ocrData.capital || '';//注册资本
                    this.ocrData.businessOcr = ocrData.business || '';//经营范围
                    if(flag){
                      this.checkOrcReturn(messageText,'baidu_ocr_business_license');
                    }
                  };
                  //身份证正面
                  if(ocr == 'baidu_ocr_idcard_front'){
                    let flag = false;
                    let messageText = "";
                    if(!formData.principalCertno || formData.principalCertno == ocrData.num){
                      this.formData.principalCertno = ocrData.num;
                    }else{
                      if(ocrData.num){
                        flag = true;
                        messageText = messageText + "<div style='display:flex'><div>" + "身份证号：</div><div style='flex:1;word-wrap:break-word;word-break:break-all'>"+ ocrData.num + "</div></div>";
                      }
                    }
                    if(!formData.principalPerson || formData.principalPerson == ocrData.name){
                      this.formData.principalPerson = ocrData.name;
                    }else{
                      if(ocrData.name){
                        flag = true;
                        messageText = messageText + "<div style='display:flex'><div>" + this.principalNameLb() + "姓名：</div><div style='flex:1;word-wrap:break-word;word-break:break-all'>"+ ocrData.name + "</div></div>";
                      }
                    }

                    this.ocrData.principalCertnoOcr = ocrData.num || '';//身份证号
                    this.ocrData.idcardNameOcr = ocrData.name || '';//姓名
                    this.ocrData.idcardNationalityOcr = ocrData.nationality || '';//民族
                    this.ocrData.idcardSexOcr = ocrData.sex || '';//性别
                    this.ocrData.idcardBirthOcr = ocrData.birth || '';//出生日期
                    this.ocrData.idcardAddressOcr = ocrData.address || '';//地址信息
                    if(flag){
                      this.checkOrcReturn(messageText,'baidu_ocr_idcard_front');
                    }
                  };
                  //身份证反面
                  if(ocr == 'baidu_ocr_idcard_back'){
                    let flag = false;
                    let messageText = "";
                    //身份证有效期
                    let startDate = ocrData.startDate?ocrData.startDate:'';//ocr返回的是‘20190101’转换成‘2019-01-02’格式
                    let endDate = ocrData.endDate?ocrData.endDate:'';
                    const startYear = moment(startDate.replace(/-/g,"/")).format('YYYY');
                    const endYear = moment(endDate.replace(/-/g,"/")).format('YYYY');
                    let difference = endYear - startYear;
                    if(difference<=0){
                      endDate = '';
                    };
                    let differenceFlag = false;
                    this.legalIdnumExpire.data.map((item)=>{
                      if(difference <= 20){
                        if(item.key == difference){
                          differenceFlag = true;
                        }
                      }else{
                        differenceFlag = true;
                      }
                    });
                    if(!differenceFlag){
                      endDate = '';
                    };
                    if((!formData.legalIdnumExpireStart || formData.legalIdnumExpireStart == startDate) && (!formData.legalIdnumExpire || formData.legalIdnumExpire == (endDate == '2999-12-31'?'29991231':endDate ))){
                      if(startDate && endDate){
                        this.formData.legalIdnumExpireStart = startDate;//起始时间
                        if(difference > 20){
                          this.formData.legalIdnumExpire = '29991231';//结束时间
                          endDate = '29991231';
                        }else{
                          this.formData.legalIdnumExpire = difference;
                          endDate = difference;
                        }
                      }else{
                        this.formData.legalIdnumExpireStart = '';//起始时间
                        this.formData.legalIdnumExpire = '';//结束时间
                      }
                    }else{
                      if(startDate && endDate){
                        flag = true;
                        if(difference > 20){
                          endDate = '29991231';//结束时间
                        }else{
                          endDate = difference
                        }
                        messageText = messageText + "<div style='display:flex'><div>" + "身份证有效期：</div><div style='flex:1;word-wrap:break-word;word-break:break-all'>"+ startDate + " 至 " +(endDate == '29991231'?'长期':difference+'年') + "</div></div>";
                      }

                    };
                    this.ocrData.legalIdnumExpireStartOcr = startDate || '';//有效期起始时间
                    this.ocrData.legalIdnumExpireOcr = endDate;//有效期结束时间
                    this.ocrData.idcardIssueOcr = ocrData.issue || '';//签发机关
                    if(flag){
                      this.checkOrcReturn(messageText,'baidu_ocr_idcard_back');
                    }
                  };
                  //收款账户身份证正面
                  if(ocr == 'baidu_ocr_bank_idcard_front'){
                    let flag = false;
                    let messageText = "";
                    if(!formData.certNo || formData.certNo == ocrData.num){
                      this.formData.certNo = ocrData.num;
                    }else{
                      if(ocrData.num){
                        flag = true;
                        messageText = messageText + "<div style='display:flex'><div>" + "身份证号：</div><div style='flex:1;word-wrap:break-word;word-break:break-all'>"+ ocrData.num + "</div></div>";
                      }
                    }
                    if(!formData.bankCertName || formData.bankCertName == ocrData.name){
                      this.formData.bankCertName = ocrData.name;
                    }else{
                      if(ocrData.name){
                        flag = true;
                        messageText = messageText + "<div style='display:flex'><div>" + this.principalNameLb() + "开户名：</div><div style='flex:1;word-wrap:break-word;word-break:break-all'>"+ ocrData.name + "</div></div>";
                      }
                    }

                    this.ocrData.certNoOcr = ocrData.num || '';//身份证号
                    this.ocrData.bankCertNameOcr = ocrData.name || '';//姓名
                    this.ocrData.bankIdcardNationalityOcr = ocrData.nationality || '';//民族
                    this.ocrData.bankIdcardSexOcr = ocrData.sex || '';//性别
                    this.ocrData.bankIdcardBirthOcr = ocrData.birth || '';//出生日期
                    this.ocrData.bankIdcardAddressOcr = ocrData.address || '';//地址信息
                    if(flag){
                      this.checkOrcReturn(messageText,'baidu_ocr_bank_idcard_front');
                    }
                  }
                  //收款账户身份证反面
                  if(ocr == 'baidu_ocr_bank_idcard_back'){
                    let flag = false;
                    let messageText = "";
                    //身份证有效期
                    let startDate = ocrData.startDate?ocrData.startDate:'';//ocr返回的是‘20190101’转换成‘2019-01-02’格式
                    let endDate = ocrData.endDate?ocrData.endDate:'';
                    const startYear = moment(startDate.replace(/-/g,"/")).format('YYYY');
                    const endYear = moment(endDate.replace(/-/g,"/")).format('YYYY');
                    let difference = endYear - startYear;
                    if(difference <= 0){
                      endDate = '';
                    };
                    let differenceFlag = false;
                    this.legalIdnumExpire.data.map((item)=>{
                      if(difference <= 20){
                        if(item.key == difference){
                          differenceFlag = true;
                        }
                      }else{
                        differenceFlag = true;
                      }
                    });
                    if(!differenceFlag){
                      endDate = '';
                    };
                    if((!formData.merchantIdExpireStart || formData.merchantIdExpireStart == startDate) && (!formData.merchantIdExpire || formData.merchantIdExpire == (endDate == '2999-12-31'?'29991231':endDate ))){
                      if(startDate && endDate){
                        this.formData.merchantIdExpireStart = startDate;//起始时间
                        if(difference > 20){
                          this.formData.merchantIdExpire = '29991231';//结束时间
                          endDate = '29991231';
                        }else{
                          this.formData.merchantIdExpire = difference;
                          endDate = difference;
                        }
                      }else{
                        this.formData.merchantIdExpireStart = '';//起始时间
                        this.formData.merchantIdExpire = '';//结束时间
                      }
                    }else{
                      if(startDate && endDate){
                        flag = true;
                        if(difference > 20){
                          endDate = '29991231';//结束时间
                        }else{
                          endDate = difference;
                        }
                        messageText = messageText + "<div style='display:flex'><div>" + "身份证有效期：</div><div style='flex:1;word-wrap:break-word;word-break:break-all'>"+ startDate + " 至 " + (endDate == '29991231'?'长期':difference+'年') + "</div></div>";
                      }

                    };
                    this.ocrData.merchantIdExpireStartOcr = startDate || '';//有效期起始时间
                    this.ocrData.merchantIdExpireOcr = endDate;//有效期结束时间
                    this.ocrData.bankIdcardIssueOcr = ocrData.issue || '';//签发机关
                    if(flag){
                      this.checkOrcReturn(messageText,'baidu_ocr_bank_idcard_back');
                    }
                  };
                  //银行卡
                  if(ocr == 'baidu_ocr_bankcard'){
                    let flag = false;
                    let messageText = "";
                    if(!formData.bankCardNo || formData.bankCardNo == ocrData.num){
                      this.formData.bankCardNo = ocrData.num;
                    }else{
                      if(ocrData.num){
                        flag = true;
                        messageText = messageText + "<div style='display:flex'><div>" + "银行账号：</div><div style='flex:1;word-wrap:break-word;word-break:break-all'>"+ ocrData.num + "</div></div>";
                      }
                    }
                    this.ocrData.bankCardNoOcr = ocrData.num || '';//银行卡账号
                    this.ocrData.bankCardNameOcr = ocrData.bankName || '';//银行卡名字
                    if(flag){
                      this.checkOrcReturn(messageText,'baidu_ocr_bankcard');
                    }
                  }

                }else{
                  MessageBox({
                    title: '提示',
                    message: '无法识别图片中的内容，通常是由于图片模糊不清造成，建议更换清晰图片',
                    confirmButtonText:'知道了'
                  });
                }
              }
              return;
            }
            var msg = result.msg || "上传失败";
            Toast(msg);
          },
          function(result) {

          }
        );
      },
      //ocr图像识别
      checkOrcReturn(messageText,ocr){
        MessageBox({
          title: '是否覆盖已有内容',
          message: `<div style="text-align:left">${messageText}</div>`,
          confirmButtonText:'是',
          cancelButtonText:'否',
          showCancelButton: true
        }).then((action) => {
          if(action == 'confirm'){
            if(ocr == 'baidu_ocr_business_license'){
              this.formData.bussAuthNum = this.ocrData.bussAuthNumOcr || '';//注册号
              this.formData.yzLicenseRegisterAddress = this.ocrData.businessAddressOcr || '';//营业执照注册地址
              this.formData.merchantCompany = this.ocrData.merchantCompanyOcr || '';//公司名称
              if(this.ocrData.licenseExpireStartOcr && this.ocrData.licenseExpireOcr){
                this.formData.licenseExpireStart = this.ocrData.licenseExpireStartOcr || '';//公司注册日期
                this.formData.licenseExpire = this.ocrData.licenseExpireOcr || '';//营业期限终止日期
              }

              //this.formData.principalPerson = this.ocrData.principalPersonOcr || '';//公司法人
            }
            if(ocr == 'baidu_ocr_idcard_front'){
              this.formData.principalCertno = this.ocrData.principalCertnoOcr || '';//身份证号
              this.formData.principalPerson = this.ocrData.idcardNameOcr || '';
            }
            if(ocr == 'baidu_ocr_idcard_back'){
              if(this.ocrData.legalIdnumExpireStartOcr && this.ocrData.legalIdnumExpireOcr){
                this.formData.legalIdnumExpireStart = this.ocrData.legalIdnumExpireStartOcr || '';//有效期起始时间
                this.formData.legalIdnumExpire = this.ocrData.legalIdnumExpireOcr || '';//有效期结束时间
              }
            }
            if(ocr == 'baidu_ocr_bankcard'){
              this.formData.bankCardNo = this.ocrData.bankCardNoOcr || '';//银行卡账号
            }
            if(ocr == 'baidu_ocr_bank_idcard_front'){
              this.formData.certNo = this.ocrData.certNoOcr || '';//身份证号
              this.formData.bankCertName = this.ocrData.bankCertNameOcr || '';
            }
            if(ocr == 'baidu_ocr_bank_idcard_back'){
              if(this.ocrData.merchantIdExpireStartOcr && this.ocrData.merchantIdExpireOcr){
                this.formData.merchantIdExpireStart = this.ocrData.merchantIdExpireStartOcr || '';//有效期起始时间
                this.formData.merchantIdExpire = this.ocrData.merchantIdExpireOcr || '';//有效期结束时间
              }
            }
          }
        })
      },
      //数据处理*******************************
      //所属类目数据处理
      getResetCategory(list, dept) {
        //重置门店分类格式
        var ary = [];
        var currentDept = dept + 1;
        for (var i = 0; i < list.length; i++) {
          var item = {
            key: list[i].categoryId,
            value: list[i].name
          };
          //默认选中逻辑处理
          var oldLen = this.category.anchor.length;

          if (currentDept < 3) {
            var children = this.getResetCategory(list[i].children, currentDept);
            if (children) {
              item.children = children;
            }
            //设置默认选中的数组
            var newLen = this.category.anchor.length;
            if (newLen > oldLen) {
              this.category.anchor[this.category.anchor.length] = i;
            }
          }
          if (currentDept === 1) {
            if (item.children.length === 0) {
              item.children[item.children.length] = { children: [] };
            }
          }
          ary[ary.length] = item;
          //设置默认选中的数组
          if (list[i].categoryId == this.categoryId) {
            this.category.anchor[this.category.anchor.length] = i;
          }
        }
        return ary;
      },
      //经营类目数据处理
      resetMccData(data){
        const newData = data;
        const restData = (datas) =>{
          datas.map((item,index)=>{
            const key = item.value;
            item.key = key;
            item.value = item.label;
            if(item.children){
              restData(item.children)
            }
          })
        }
        restData(newData);
        return newData
      },
      //门店区域code转换成fuyou区域code
      areaCodeRepeat(data,v){
        let checkKey = '';
        const check = (datas,val) =>{
          for(let i =0;i<datas.length;i++){
            if(datas[i].value == val){
              checkKey =  datas[i].key
            }
            if(datas[i].children){
              check(datas[i].children,val)
            }
          }
        }
        check(data,v)
        return checkKey
      },
      //开户行所在地区数据处理
      resetBranchAreaData(data){
        const newData = [];
          data.map((item,index)=>{
            if(item.cityType == 'province'){
              const obj = {
                key:item.fuyouCityId,
                value:item.fuyouCityName,
                children:[]
              }
              newData.push(obj)
            }

          })
          data.map((item,index)=>{
            if(item.cityType == 'city'){
              const obj = {
                key:item.fuyouCityId,
                value:item.fuyouCityName,
                pid:item.fuyouCityPid
              }
              for(let i =0;i<newData.length;i++){
                if(newData[i].key == obj.pid){
                  newData[i].children.push(obj)
                }
              }
            }
          })
        return newData
      },
      //门店所在地区数据处理
      resetStoreAreaData(data){
        const newData = [];
          data.map((item,index)=>{
            if(item.cityType == 'province'){
              const obj = {
                key:item.fuyouCityId,
                value:item.fuyouCityName,
                children:[]
              }
              newData.push(obj)
            }

          })
          data.map((item,index)=>{
            if(item.cityType == 'city'){
              const obj = {
                key:item.fuyouCityId,
                value:item.fuyouCityName,
                pid:item.fuyouCityPid,
                children:[]
              }
              for(let i =0;i<newData.length;i++){
                if(newData[i].key == obj.pid){
                  newData[i].children.push(obj)
                }
              }
            }
          })
          data.map((item,index)=>{
            if(item.cityType == 'district'){
              const obj = {
                key:item.fuyouCityId,
                value:item.fuyouCityName,
                pid:item.fuyouCityPid,
              }
              for(let i =0;i<newData.length;i++){
                for(let j=0;j<newData[i].children.length;j++){
                  if(newData[i].children[j].key == obj.pid){
                    newData[i].children[j].children.push(obj)
                  }
                }

              }
            }
          })
        return newData
      },
      //开户银行数据处理
      resetBankData(data){
        const newData = [];
        data.map((item)=>{
          const obj ={
            key:item.bankId,
            value:item.bankMainName
          };
          newData.push(obj);
        })
        return newData
      },
      //支行名称数据处理
      resetBranchData(data){
        const newData = [];
        data.map((item)=>{
          const obj ={
            key:item.contactLine,
            value:item.bankName
          };
          newData.push(obj);
        })
        return newData
      },
      //检查邀请码
      checkInvitationCode(){
        this.formData.bdMobile = '';
        this.formData.msgCodeOk = false;
        this.formData.msgCode = '';
        if(this.formData.invitationCode.length == 0){
          Toast("请输入邀请码");
        }else if(this.formData.invitationCode.length<6&&this.formData.invitationCode.length>0){
          Toast("请输入有效的邀请码");
        }else{
          let url = '/app/shop/checkInvitationCode.do?invitationCode='+this.formData.invitationCode;
          this.ajax({
          type: "get",
          url: url
        }).then((response)=>{
          var msg = response.msg || "验证邀请码失败，请稍后重试";
          if (response && response.success) {
            this.formData.bdMobile = response.resultObject;
            Toast("邀请码正确，准备短信验证"+this.formData.bdMobile);
          }else{
            Toast(msg);
          }
        });
        }
      },

      //页面交互*******************************
      //点击请选择弹出选择项
      //选择图片的方式本地相册或者拍照,如果传ocr需要进行ocr图像识别
      chooseImg: function(type,ocr) {
        var _this = this;
        _this.actions = [
          {
            name: "拍照",
            method: function() {
              jsBridge.selectPicture(
                { options: "拍照", noCrop: true, compress: { sizeLimit: "1", unit: "M" }},
                function(result) {
                  _this.doUploadPic(type, result, ocr );
                },
                function(result) {

                }
              );
            }
          },
          {
            name: "选择图片",
            method: function() {
              jsBridge.selectPicture(
                {
                  options: "选择图片",
                  noCrop: true,
                  compress: { sizeLimit: "1", unit: "M" }
                },
                function(result) {
                    _this.doUploadPic(type, result, ocr );
                },
                function(result) {

                }
              );
            }
          }
        ];

        this.chooseImgVisible = true;
        return false;
      },

      //删除图片
      delImage(key) {
        if(typeof(this.formData[key]) == 'string'){
          this.formData[key] = "";
          return
        }
        if(typeof(this.formData[key]) == 'object'){
          this.formData[key].splice(0,1);
          return
        }

      },
      //根据枚举展示字段名字
      showIdName(data,key){
        let name ='';
        const checkName = (datas,keys) =>{
          for(let i =0; i<datas.length;i++){
            if(datas[i].key == keys){
              name = datas[i].value;
              return
            }
            if(datas[i].children){
              checkName(datas[i].children,keys)
            }
          }
        }
        checkName(data,key)
        return name
      },
      //处理ocr返回的日期格式
      dealOcrDate(date){
        if(date){
          let newstr="";
          newstr = date.substring(0,4) + '-' + date.substring(4,6) + '-' + date.substring(6,date.length);
          return newstr
        }
        return ''
      },
      dateToPeriod(start,end){
        if(start&&end){
          if(end == '29991231'){
            return
          }else{
            return moment(end.replace(/-/g,"/")).format('YYYY') - moment(start.replace(/-/g,"/")).format('YYYY');
          }
        }else{
          return
        }
      },
      //根据value获取key
      getId(data,val,lev){
        if(lev == 1){
          for(let i =0; i<data.length;i++){
            if(data[i].value == val){
              return data[i].key || data[i].id;
            }
          }
        }
        if(lev == 2){
          for(let i =0; i<data.length;i++){
            for(let j =0; j<data[i].children.length;j++){
              let lev2Data =  data[i].children[j]
              if(lev2Data.value == val){
                return lev2Data.key || lev2Data.id;
              }
            }
          }
        }
        if(lev == 3){
          for(let i =0; i<data.length;i++){
            for(let j =0; j<data[i].children.length;j++){
              let lev2Data =  data[i].children[j]
              for(let n =0; n<lev2Data.children.length;n++){
                let lev3Data =  lev2Data.children[n];
                if(lev3Data.value == val){
                  return lev3Data.key || lev3Data.id;
                }
              }
            }
          }
        }
        return
      },
      getAwesomeData(data){
        let newData =[[]];
        data.map((item)=>{
          newData[0].push(item.value)
        });
        return newData
      },
      showPicker(ref) {
        this.$forceUpdate();
        if(ref == 'bank'){
          if(this.formData.branchProvince && this.formData.branchCity){
            this.$refs[ref].show();

          }else{
            Toast("请选择开户行所在地区");
            return
          }
        }
        if(ref == 'branchName'){
          if(!this.formData.bankCode && !this.formData.bankId){
            Toast("请选择开户银行");
            return
          }else{
            this.$refs[ref].show();
            return
          }
        }
        this.$refs[ref].show();
        this.$forceUpdate();
      },
      //弹窗选择回掉赋值
      handleConfirm(key,v,data){
        //商户类型切换清空下面对应数据
        if(key == 'merchantType'){
          this.formData.merchantCompany = '';//公司全称
          this.formData.yzLicensePhoto = '';//营业执照照片
          this.formData.bussAuthNum= '';//营业执照注册号
          this.formData.principalPerson = '';//法人姓名
          this.formData.licenseExpireStart = '';//营业执照有效期起始时间
          this.formData.licenseExpire= '';//营业执照有效期使用年限
          this.formData.licenseType= '1';//是否三证合一
          this.formData.yzCertPhotoa = '';//身份证照正面
          this.formData.yzCertPhotob = '';//身份证照反面
          this.formData.principalCertno= '';//身份证号
          this.formData.legalIdnumExpireStart= '';//身份证有效期起始时间
          this.formData.legalIdnumExpire = '';//身份证有效期使用年限
          this.ocrData.bussAuthNumOcr =  '';//注册号
          this.ocrData.merchantCompanyOcr =  '';//公司名称
          this.ocrData.licenseExpireStartOcrOcr = '';//公司注册日期
          this.ocrData.licenseExpireStartOcr = '';//营业期限终止日期
          this.ocrData.principalPersonOcr = '';//公司法人
          this.ocrData.businessTypeOcr = '';//公司类型
          this.ocrData.businessAddressOcr = '';//公司地址
          this.ocrData.businessCapitalOcr = '';//注册资本
          this.ocrData.businessOcr = '';//经营范围
          this.ocrData.principalCertnoOcr = '';//身份证号
          this.ocrData.idcardNameOcr = '';//姓名
          this.ocrData.idcardNationalityOcr = '';//民族
          this.ocrData.idcardSexOcr = '';//性别
          this.ocrData.idcardBirthOcr = '';//出生日期
          this.ocrData.idcardAddressOcr = '';//地址信息
          this.ocrData.legalIdnumExpireStartOcr = '';//有效期起始时间
          this.ocrData.legalIdnumExpireOcr = '';//有效期结束时间
          this.ocrData.idcardIssueOcr = '';//签发机关
          this.formData.mcc='';//经营类目
          this.formData.mccName='';//经营类目名称
          this.formData.mccRout='';
          if(this.getId(data,v[v.length-1].value,v.length) == '01'){
            this.formData.accountType = '01';
            this.formData.settleAccountsType ='';
            this.formData.yzImgUnincorporated = '';
            this.formData.yzIndustryLicensePhoto = '';
            this.formData.yzImgBankcardA = '';
            this.formData.yzImgPrivateIdcardA = '';
            this.formData.yzImgPrivateIdcardB = '';
            this.formData.certNo = '';
            this.formData.merchantIdExpireStart = '';
            this.formData.merchantIdExpire = '';
            this.ocrData.bankCardNoOcr = '';//银行卡账号
            this.ocrData.bankCardNameOcr = '';//银行卡名字
          }else{
            this.formData.accountType = '02';
            this.formData.settleAccountsType ='';
            this.formData.yzImgUnincorporated = '';
            this.formData.yzIndustryLicensePhoto = '';
            this.formData.yzImgBankcardA = '';
            this.formData.yzImgPrivateIdcardA = '';
            this.formData.yzImgPrivateIdcardB = '';
            this.formData.certNo = '';
            this.formData.merchantIdExpireStart = '';
            this.formData.merchantIdExpire = '';
            this.ocrData.bankCardNoOcr = '';//银行卡账号
            this.ocrData.bankCardNameOcr = '';//银行卡名字
          }
          this[key].anchor = [v[0].index];
          this.formData[key] = this.getId(data,v[v.length-1].value,v.length);
          this.getMccData();
          return
        };
        if(key == 'accountType'){
          this.formData.settleAccountsType ='';
          this.formData.yzImgUnincorporated = '';
          this.formData.yzIndustryLicensePhoto = '';
          this.formData.yzImgBankcardA = '';
          this.formData.yzImgPrivateIdcardA = '';
          this.formData.yzImgPrivateIdcardB = '';
          this.formData.certNo = '';
          this.formData.merchantIdExpireStart = '';
          this.formData.merchantIdExpire = '';
          this.ocrData.bankCardNoOcr = '';//银行卡账号
          this.ocrData.bankCardNameOcr = '';//银行卡名字
          this.formData.bankCertName = '';
          if(this.formData.merchantType == '03' || (this.formData.merchantType == '02'&&this.formData.accountType == '02')){
            this.formData.reserveBankCertName = '';//公户开户名
            this.formData.reserveBankCardNo = '';//公户卡号
            this.formData.reserveBranchProvince = '';//公户开户行省code
            this.formData.reserveBranchProvinceName = '';//公户开户行省名称
            this.formData.reserveBranchCity = '';//公户开户行城市code
            this.formData.reserveBranchCityName = '';//公户开户行城市名称
            this.formData.reserveBankId = '';//公户开户银行ID
            this.formData.reserveBankCode = '';//公户开户银行名称
            this.formData.reserveBranchName = '';//公户支行名称
            this.formData.reserveContactLine = '';//公户联行号
          }
        };
        if(key == 'settleAccountsType'){
          this.formData.yzImgUnincorporated = '';
          this.formData.yzIndustryLicensePhoto = '';
          this.formData.yzImgBankcardA = '';
          this.formData.yzImgPrivateIdcardA = '';
          this.formData.yzImgPrivateIdcardB = '';
          this.formData.certNo = '';
          this.formData.merchantIdExpireStart = '';
          this.formData.merchantIdExpire = '';
          this.ocrData.bankCardNoOcr = '';//银行卡账号
          this.ocrData.bankCardNameOcr = '';//银行卡名字
          this.formData.bankCertName = '';
        };
        if(key == 'licenseType'){
          if(this.getId(data,v[0].value,1) == '0'){
            this.formData.accountType == '02';
          }
        };
        if(key == 'category'){
          this.categorySplice = "";
          let n =0;
          for(let i =0;i<v.length;i++){
            if(v[i].value){
              n = n+1;
              this.formData.categoryName = v[i].value;
              this.categorySplice = this.categorySplice + (i != 0?'-':'') + v[i].value;
            }
          }
            this.formData.categoryId = this.getIdToIndex(data,v).key;
            this[key].anchor = [v[0].index,v[1].index,v[2].index];
          return
        }
        if(key == 'storeArea'){
          this.storeAreaName = "";
          for(let i =0;i<v.length;i++){
            if(v[i].value){
              this.storeAreaName = this.storeAreaName + (i != 0?'-':'') + v[i].value;//拼接门店区域
            }
          };
          const storeAreaData = this.getIdToIndex(data,v);
          this.formData.provinceName = storeAreaData[0]?storeAreaData[0].value:'';
          this.formData.cityName = storeAreaData[1]?storeAreaData[1].value:'';
          this.formData.districtName = storeAreaData[2]?storeAreaData[2].value:'';
          this.formData.province = storeAreaData[0]?storeAreaData[0].key:'';//省code
          this.formData.city = storeAreaData[1]?storeAreaData[1].key:'';//市code
          this.formData.district = storeAreaData[2]?storeAreaData[2].key:'';//区code
          this[key].anchor = [v[0].index,v[1].index,v[2].index];
          return
        }
        if(key == 'mcc'){
          this.formData.mccRout = '';
          this.mccSpliceName = v[0].value + (v[1]?' - ':'') + (v[1]?v[1].value:'');
          const mccData = this.getIdToIndex(data,v);
          this.formData.mcc = mccData[mccData.length-1].key || '';
          this.formData.mccName = mccData[mccData.length-1].value;
          for(let i=0;i<mccData.length;i++){
            this.formData.mccRout = this.formData.mccRout+mccData[i].key+','
          }
          this.formData.mccRout = this.formData.mccRout.slice(0,this.formData.mccRout.length-1)
          this[key].anchor = [v[0].index,v[1].index];
          return
        }
        if(key == 'branch'){
          this.branchAreaName = v[0].value + (v[1]?' - ':'') + (v[1]?v[1].value:'');
          this.formData.branchProvinceName = v[0].value || '';
          this.formData.branchCityName = v[1].value || '';
          this.formData.branchProvince = this.getId(data,v[0].value,1) || '';//省code
          this.formData.branchCity = this.getId(data,v[1].value,2) || '';//市code
          this[key].anchor = [v[0].index,v[1].index];
          this.bankItemVisible = false;
          //初始话
          this.bank.data = [];
          this.bank.anchor = [];
          this.formData.bankId ="";
          this.formData.bankCode ="";
          this.branchName.data = [];
          this.formData.branchName = '';//支行名称
          this.formData.branchCode = '';//支行code
          this.formData.contactLine = '';
          this.getBank();
          return
        }
        if(key == 'reserveBranch'){
          this.reserveBranchAreaName = v[0].value + (v[1]?' - ':'') + (v[1]?v[1].value:'');
          this.formData.reserveBranchProvinceName = v[0].value || '';
          this.formData.reserveBranchCityName = v[1].value || '';
          this.formData.reserveBranchProvince = this.getId(data,v[0].value,1) || '';//省code
          this.formData.reserveBranchCity = this.getId(data,v[1].value,2) || '';//市code
          this[key].anchor = [v[0].index,v[1].index];
          this.reserveBankItemVisible = false;
          //初始话
          this.reserveBank.data = [];
          this.reserveBank.anchor = [];
          this.formData.reserveBankId ="";
          this.formData.reserveBankCode ="";
          this.reserveBranchName.data = [];
          this.formData.reserveBranchName = '';//支行名称
          this.formData.reserveBranchCode = '';//支行code
          this.formData.reserveContactLine = '';
          this.getReserveBank();
          return
        }
        if(key == 'bank'){
          this.formData.bankCode = v[0].value;
          this.formData.bankId = this.getId(data,v[0].value,1) || '';//开户行ID
          this[key].anchor = [v[0].index];
          this.branchItemVisible = false;
          this.branchName.data = [];
          this.formData.branchName = '';//支行名称
          this.formData.branchCode = '';//支行code
          this.formData.contactLine = '';
          this.getBranchName();
          return
        }
        if(key == 'reserveBank'){
          this.formData.reserveBankCode = v[0].value;
          this.formData.reserveBankId = this.getId(data,v[0].value,1) || '';//开户行ID
          this[key].anchor = [v[0].index];
          this.reserveBranchItemVisible = false;
          this.reserveBranchName.data = [];
          this.formData.reserveBranchName = '';//支行名称
          this.formData.reserveBranchCode = '';//支行code
          this.formData.reserveContactLine = '';
          this.getReserveBranchName();
          return
        }
        if(key == 'branchName'){
          this.formData.branchName = v[0].value;
          this.formData.contactLine = this.getId(data,v[0].value,1) || '';//支行ID
          this[key].anchor = [v[0].index];
          return
        }
        if(key == 'reserveBranchName'){
          this.formData.reserveBranchName = v[0].value;
          this.formData.reserveContactLine = this.getId(data,v[0].value,1) || '';//支行ID
          this[key].anchor = [v[0].index];
          return
        }
        this[key].anchor = [v[0].index];
        this.formData[key] = this.getId(data,v[v.length-1].value,v.length);
      },
      showImg: function(url) {
        let urlArr = [];
        urlArr.push(this.repeatImgUrl(url))
        try {
          jsBridge.viewPicture(
            { files: urlArr},
            function(params) {

            }
          );
        } catch (e) {
          Toast("预览失败");
        }
      },
      getIdToIndex(data,indexArr){
        const newArr = [];
        for(let i=0;i<indexArr.length;i++){
          if(indexArr[i].value){
            newArr.push(indexArr[i])
          }
        }
        const lev = indexArr.length;
        let n = 0;
        let res = [];
        const getData =(datas)=>{
            n=n+1;
            if(n == lev){
              debugger
              res.push(datas[indexArr[n-1].index]);
            }else{
              res.push(datas[indexArr[n-1].index]);
              getData(datas[indexArr[n-1].index].children);

            }

        }
        getData(data)
        return res;
      },
      //有效期弹窗
      showPeriod(key,label,v){
        this.$refs[key].show();
        if(v){
          //拼接日期
          let year = v[0].value.substring(0,v[0].value.length-1);
          let mouth = v[1].value.substring(0,v[1].value.length-1);
          let days = v[2].value.substring(0,v[2].value.length-1);
          this.formData[label] = moment(year +'/' + mouth + '/' +days).format('YYYY-MM-DD');
        }
      },
      changeMoment(date){
        return moment(date).format('YYYY-MM-DD')
      },
      //选择使用年限
      periodConfirm(key,v,data,startTime){
        let diffVal = this.getId(data,v[0].value,1);
        this.formData[key] = diffVal
      },
      //不选使用年限清空有效期
      periodCancel(key){
        this.formData[key] = "";
      },
      //使用年限和日期转换
      periodToDate(start,deal){
        const startDate = moment(start).format('YYYY-MM-DD');
        if(startDate && deal){
          if(deal == '29991231'){
            return '长期'
          }else{
            return moment(startDate.replace(/-/g,"/")).add(deal,'years').format('YYYY-MM-DD');
          }
        }
        return
      },
      //h5调native后退
      handleBack() {
        if(this.routerFrom == 'gatheringManage'){
          this.$router.back();
          return
        }
        this.$router.push({ path: "/storeManage",query: CommonUtil.concatSessionId({}) });
      },
      //验证是否为空
      checkIsEmpty(name, str) {
        if (
          typeof str !== "string" ||
          str === "" ||
          str.replace(/^\s+|\s+$/gm, "") === ""
        ) {
          Toast("请输入" + name);
          return true;
        }
        return false;
      },
      principalNameLb(){
          switch(this.formData.merchantType){
            case '03':
            return '法人';
            break;
            case '02':
            return '经营者';
            break;
            case '01':
            return '申请人';
            break;
            default:
            return '法人'
          }
      },
      //提交表单
      submit(){
        //非自然人对公赋值取公司全称
      //   if(this.formData.merchantType != '01' && this.formData.accountType == '02'){
      //     this.formData.bankCertName = this.formData.merchantCompany
      //   }
      //   //非自然人对私法人赋值法定代表人或者经营者姓名
      //   if(this.formData.merchantType != '01' && this.formData.accountType == '01'&& this.formData.settleAccountsType == '1'){
      //     this.formData.bankCertName = this.formData.principalPerson
      //   }
      //   //自然人开户名赋值申请人姓名
      //   if(this.formData.merchantType == '01'){
      //     this.formData.bankCertName = this.formData.principalPerson
      //   }
      //   //企业对私法人公户的开户名赋值法人姓名
      //   if(this.formData.merchantType == '03'&&this.formData.accountType == '01'){
      //       this.formData.reserveBankCertName = this.formData.merchantCompany
      //   }
      //   //时间转成13位时间戳
      // if (this.formData.legalIdnumExpireStart) {
      //   this.formData.legalIdnumExpireStart = moment(this.formData.legalIdnumExpireStart)
      //     .endOf("d")
      //     .valueOf();
      // }
      // if (this.formData.licenseExpireStart) {
      //   this.formData.licenseExpireStart = moment(this.formData.licenseExpireStart)
      //     .endOf("d")
      //     .valueOf();
      // }
      // if (this.formData.merchantIdExpireStart) {
      //   this.formData.merchantIdExpireStart = moment(this.formData.merchantIdExpireStart)
      //     .endOf("d")
      //     .valueOf();
      // }
        this.formData.payType = this.payType;
        debugger
        return;
        if(this.isChecked){
          if(this.sumbitVerify()){
            let url = '/newapp/AppMerchant/apply.do';
              this.ajax({
              type: "post",
              url: url,
              data:this.formData
            }).then((response)=>{
              var msg = response.msg
              if (response && response.success) {
                Toast('提交成功，待审批！')
                this.$router.push({ path: "/storeManage",query: CommonUtil.concatSessionId({}) });
                }else{
                  Toast(msg)
                }
            });
          }
        }else{
          Toast('请阅读并同意协议')
        }

      },
      //下一步
      next(){
        //this.firstStep = false;
        if(this.nextVerify()){
          if(!this.ocrChangeFlag){
            $('.page-body').scrollTop(0);
              this.firstStep = false;
              return;
          }
          if(this.formData.merchantType != '01'){
            if(this.ocrData.idcardNameOcr&&this.ocrData.principalPersonOcr){
              if(this.formData.principalPerson != this.ocrData.idcardNameOcr || this.formData.principalPerson != this.ocrData.principalPersonOcr || this.ocrData.principalPersonOcr!=this.ocrData.idcardNameOcr){
                MessageBox({
                  title: '提示',
                  message: '页面填写的法人/经营者/申请人姓名与营业执照、身份证识别出的姓名不一致，请确认无误后再提交',
                  confirmButtonText:'继续提交',
                  cancelButtonText:'取消',
                  showCancelButton: true
                }).then((action) => {
                  if(action == 'confirm'){
                    $('.page-body').scrollTop(0);
                      this.firstStep = false;
                  }
                })
              }else{
                $('.page-body').scrollTop(0);
                  this.firstStep = false;
              }
            }else{
              MessageBox({
                title: '提示',
                message: '页面填写的法人/经营者/申请人姓名与营业执照、身份证识别出的姓名不一致，请确认无误后再提交',
                confirmButtonText:'继续提交',
                cancelButtonText:'取消',
                showCancelButton: true
              }).then((action) => {
                if(action == 'confirm'){
                  $('.page-body').scrollTop(0);
                    this.firstStep = false;
                }
              })
            }
          }else{
            if(this.ocrData.idcardNameOcr){
              if(this.formData.principalPerson != this.ocrData.idcardNameOcr ){
                MessageBox({
                  title: '提示',
                  message: '页面填写的法人/经营者/申请人姓名与营业执照、身份证识别出的姓名不一致，请确认无误后再提交',
                  confirmButtonText:'继续提交',
                  cancelButtonText:'取消',
                  showCancelButton: true
                }).then((action) => {
                  if(action == 'confirm'){
                    $('.page-body').scrollTop(0);
                      this.firstStep = false;
                  }
                })
              }else{
                $('.page-body').scrollTop(0);
                  this.firstStep = false;
              }
            }else{
              MessageBox({
                title: '提示',
                message: '页面填写的法人/经营者/申请人姓名与营业执照、身份证识别出的姓名不一致，请确认无误后再提交',
                confirmButtonText:'继续提交',
                cancelButtonText:'取消',
                showCancelButton: true
              }).then((action) => {
                if(action == 'confirm'){
                  $('.page-body').scrollTop(0);
                    this.firstStep = false;
                }
              })
            }
          }
        }
      },
      //返回上一步
      previous(){
        $('.page-body').scrollTop(0);
        this.firstStep = true;
      },
      //展开附加项
      appendInfo(){
        this.appendFlag = !this.appendFlag;
      },
      //提交前对所有字段的校验
      nextVerify(){

        if (!this.formData.merchantType) {
          Toast("请选择商户类型");
          return false;
        };
        if (this.checkIsEmpty("公司全称", this.formData.merchantCompany)) {
          return false;
        };
        if(!/^[\u4e00-\u9fa50-9a-zA-Z()（）]+$/.test(this.formData.merchantCompany)) {
          Toast("公司全称不允许包含特殊符号");
          return false;
        };
        if(!/^(?!\d+$)[\d\u4e00-\u9fa50-9a-zA-Z()（）]+$/.test(this.formData.merchantCompany)) {
          Toast("公司全称不能是纯数字");
          return false;
        };
        if (this.formData.merchantType == '03' || this.formData.merchantType == '02') {
          if(!this.formData.yzLicensePhoto){
            Toast("请上传营业执照照片");
            return false;
          }

          if(this.checkIsEmpty("营业执照注册地址", this.formData.yzLicenseRegisterAddress)){
            return false;
          };
          if(this.checkIsEmpty("营业执照注册号", this.formData.bussAuthNum)){
            return false;
          };
          if(!/^[0-9a-zA-Z]+$/.test(this.formData.bussAuthNum)) {
            Toast("营业执照注册号不允许包含特殊符号");
            return false;
          };
          if(!this.formData.licenseExpireStart&&!this.formData.licenseExpire){
            Toast("请选择营业执照有效期");
            return false;
          }
          if (!this.formData.licenseType) {
            Toast("请选择是否三证合一");
            return false;
          };
        };
        if (!this.formData.yzCertPhotoa) {
          Toast("请上传身份证照片正面");
          return false;
        };
        if (!this.formData.yzCertPhotob) {
          Toast("请上传身份证照片反面");
          return false;
        };
        if (!this.formData.principalPerson) {
          Toast("请填写"+this.principalNameLb()+'姓名');
          return false;
        };
        if (!/^[\u4e00-\u9fa50-9a-zA-Z.·]+$/.test(this.formData.principalPerson)) {
          Toast(this.principalNameLb()+'姓名不允许包含特殊字符');
          return false;
        };
        if (!this.formData.principalCertno) {
          Toast("请输入身份证号码");
          return false;
        }
        var test = /^[1-9]\d{7}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])\d{3}$/;
        var reg = /^[1-9]\d{5}[1-9]\d{3}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])\d{3}([0-9]|X)$/;
        if (!reg.test(this.formData.principalCertno) && !test.test(this.formData.principalCertno)) {
          Toast("请输入正确的身份证号码");
          return false;
        }
        if (!this.formData.legalIdnumExpireStart&&!this.formData.legalIdnumExpire) {
          Toast("请选择身份证有效期");
          return false;
        }

        if (this.checkIsEmpty("客服电话", this.formData.servicePhoneNo)) {
          return false;
        };
        if (!/^1[0-9]{10}$/.test(this.formData.servicePhoneNo)) {
          Toast("请填写有效手机号");
          return false;
        }
        if (!this.formData.province || !this.formData.city || !this.formData.district || !this.formData.provinceName || !this.formData.cityName || !this.formData.districtName) {
          Toast("请选择门店区域");
          return false;
        };
        if (this.checkIsEmpty("门店地址", this.formData.address)) {
          return false;
        };
        if (!this.formData.yzShopPhoto) {
          Toast("请上传门头照");
          return false;
        };
        if (!this.formData.yzCheckstandPic) {
          Toast("请上传收银台照");
          return false;
        };
        if (!this.formData.yzIndoorPic) {
          Toast("请上传内景照");
          return false;
        };
        return true
      },
      sumbitVerify(){
        //汉字、数字、英文字母半角括号
        const merchantCompanyReg = /^[\u4e00-\u9fa5a-zA-Z0-9()（）]+$/;
        if (!this.formData.merchantName) {
          Toast("请填写商户名称");
          return false;
        };
        if (!merchantCompanyReg.test(this.formData.merchantName)) {
          Toast("商户名称不允许包含特殊字符");
          return false;
        };
        if(!this.mccSpliceName){
          Toast("请选择经营类目");
          return false;
        }
        if (!this.formData.alias) {
          Toast("请填写门店简称");
          return false;
        };
        if (!/^[\u4e00-\u9fa5a-zA-Z0-9()（）]+$/.test(this.formData.alias)) {
          Toast("门店简称不允许包含特殊字符");
          return false;
        };
        if (!this.formData.principalMobile) {
          Toast("请填写" + this.principalNameLb() + "手机号");
          return;
        };
        if (!/^1[0-9]{10}$/.test(this.formData.principalMobile)) {
          Toast("请填写有效手机号");
          return false;
        };
        if (!this.formData.email) {
          Toast("请填写负责人邮箱");
          return false;
        };
        if (!(/^([0-9A-Za-z\-_\.]+)@([0-9a-z]+\.[a-z]{2,3}(\.[a-z]{2})?)$/g).test(this.formData.email)) {
          Toast("请填写有效的邮箱");
          return false;
        };
        if(this.formData.merchantType == '01'){
          if(!this.formData.yzImgIdcardHolding){
            Toast("请上传手持身份证照片");
          };
        };
        if(this.formData.licenseType == '0'&&this.formData.merchantType !='01'){
          if (!this.formData.yzPrgPhoto) {
            Toast("请上传组织机构代码证照片");
            return false;
          };
          if (!this.formData.yzImgTaxReg) {
            Toast("请上传税务登记证照片");
            return false;
          };
        }
        if (!this.formData.accountType) {
          Toast("请选择账户类型");
          return false;
        };
        if(this.formData.accountType == '01' && this.formData.merchantType != '01'){
          if (!this.formData.settleAccountsType) {
            Toast("请选择结算账户");
            return false;
          };
        };
        if(this.formData.merchantType == '03'&&this.formData.accountType == '01'){
          if (!this.formData.reserveBankCertName) {
            Toast("请填写开户人名称");
            return false;
          };
          if (!/^[\u4e00-\u9fa50-9a-zA-Z（）().·]+$/.test(this.formData.reserveBankCertName)) {
            Toast('开户人名称不允许包含特殊字符');
            return false;
          };
          if (!this.formData.reserveBankCardNo) {
            Toast("请填写银行账号");
            return false;
          };
          if (!this.reserveBranchAreaName) {
            Toast("请选择开户行所在地区");
            return false;
          };
          if (!this.formData.reserveBankCode) {
            Toast("请选择开户银行");
            return false;
          };
          if (!this.formData.reserveBranchName) {
            Toast("请选择支行");
            return false;
          };
          if (!this.formData.reserveContactLine) {
            Toast("请填写联行号");
            return false;
          };
        }
        if(this.formData.settleAccountsType == '2'){
          if (this.formData.yzImgUnincorporated.length == 0) {
            Toast("请上传非法人结算证明");
            return false;
          };
        };
        if(this.formData.merchantType == '03' || (this.formData.merchantType == '02'&&this.formData.accountType == '02')){
          if (this.formData.yzIndustryLicensePhoto.length == 0) {
            Toast("请上传开户许可证照片");
            return false;
          };
        };
        if(this.formData.accountType != '02' || this.formData.merchantType == '01'){
          if (this.formData.yzImgBankcardA.length == 0) {
            Toast("请上传银行卡照片");
            return false;
          };
        };
        if(this.formData.settleAccountsType == '2'){
          if (this.formData.yzImgPrivateIdcardA.length == 0) {
            Toast("请上传身份证照片（正面）");
            return false;
          };
          if (this.formData.yzImgPrivateIdcardB.length == 0) {
            Toast("请上传身份证照片（反面）");
            return false;
          };
          if (!this.formData.certNo) {
            Toast("请填写身份证号");
            return false;
          };
          var test = /^[1-9]\d{7}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])\d{3}$/;
          var reg = /^[1-9]\d{5}[1-9]\d{3}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])\d{3}([0-9]|X)$/;
          if (!reg.test(this.formData.certNo) && !test.test(this.formData.certNo)) {
            Toast("请输入正确的身份证号码");
            return false;
          }
          if (!this.formData.merchantIdExpireStart&&!this.formData.merchantIdExpire) {
            Toast("请选择身份证有效期");
            return false;
          }
        };
        if (!this.formData.bankCertName) {
          Toast("请填写开户人名称");
          return false;
        };
        if (!/^[\u4e00-\u9fa50-9a-zA-Z（）().·]+$/.test(this.formData.bankCertName)) {
          Toast('开户人名称不允许包含特殊字符');
          return false;
        };
        if (!this.formData.bankCardNo) {
          Toast("请填写银行账号");
          return false;
        };
        if (!this.branchAreaName) {
          Toast("请选择开户行所在地区");
          return false;
        };
        if (!this.formData.bankCode) {
          Toast("请选择开户银行");
          return false;
        };
        if (!this.formData.branchName) {
          Toast("请选择支行");
          return false;
        };
        if (!this.formData.contactLine) {
          Toast("请填写联行号");
          return false;
        };
        if(this.formData.accountPhone){
          if (!/^1[0-9]{10}$/.test(this.formData.accountPhone)) {
            Toast("请填写有效手机号");
            return false;
          };
        };
        return true
      }
    },
    beforeRouteEnter(to, from, next) {
      next(vm => {
        vm.routerFrom = from.name;
      });
    },
    components: {
      customHeader,
      inputClear,
      hlwsk,
      ydzfsd,
      CitysPicker
    }
  }
</script>
<style lang='scss' scoped>
  @import "openShroffAccount";
</style>
